Hi,
This is my view
<table id="table3">
<tr>
<td class="tdw">Does the school have staff houses?</td>
<td>
@Html.RadioButtonFor(model => model.charSchoolHaveStaffHouses, "Y", new { onclick = "StaffHouses_Click()", name = "rdoSchStaffHostel", id = "rdoSchStaffHousesY" })Yes
@Html.RadioButtonFor(model => model.charSchoolHaveStaffHouses, "N", new {onchanged="valid()", onclick = " $(this).resetValidation()" })No
@Html.ValidationMessageFor(model => model.charSchoolHaveStaffHouses)
</td>
</tr>
<tr>
<td>How many Staff Houses does the school have?</td>
<td class="myclass">
@Html.TextBoxFor(model => model.intStaffHousesCount, new { disabled = "disabled", maxlength = 4, onkeypress = "return validate(event)", @class = "myStyle" })
@Html.ValidationMessageFor(model => model.intStaffHousesCount)
</td>
</tr>
<tr>
<td>No Of Workers in the Staff Houses</td>
<td class="myclass">
@Html.TextBoxFor(model => model.intWorkersCountInStaffHouses, new { disabled = "disabled", maxlength = 4, onkeypress = "return validate(event)", @class = "myStyle" })
@Html.ValidationMessageFor(model => model.intWorkersCountInStaffHouses)
</td>
</tr>
<tr>
<td class="tdw">Does the school have a hostel for learners?</td>
<td>
@Html.RadioButtonFor(model => model.charSchoolHaveLearnerHostel, "Y", new { onclick = " LearnerRadio_Click()", name = "rdohostel", id = "rdohostelY" })Yes
@Html.RadioButtonFor(model => model.charSchoolHaveLearnerHostel, "N", new { onclick = " LearnerRadio_Click()" })No
@Html.ValidationMessageFor(model => model.charSchoolHaveLearnerHostel)
@*<input name="tblHostel.charSchoolHaveLearnerHostel" id="tblHostel_charSchoolHaveLearnerHostel" onclick=" LearnerRadio_Click()" type="radio" value="Y"></input>*@
@*<input type="radio" name="rdohostel" id="rdohostelY" class="rdotest" onclick=" LearnerRadio_Click()"/>Yes
<input type="radio" name="rdohostel" id="rdohostelN" class="rdotest" onclick=" LearnerRadio_Click()"/>No*@
</td>
</tr>
<tr>
<td>Does the Hostel provide accommodation for educators?</td>
<td>
@* <input type="radio" name="rdoaccommodation" id="rdoaccommodationY" onclick="EducatorRadio_Click()" />Yes
<input type="radio" name="rdoaccommodation" id="rdoaccommodationN" onclick="EducatorRadio_Click()" />No*@
@Html.RadioButtonFor(model => model.charSchoolHaveStaffHostel, "Y", new { onclick = " EducatorRadio_Click()", name = "tblHostel.charSchoolHaveLearnerHostel", id = "rdoaccommodationY" })Yes
@Html.RadioButtonFor(model => model.charSchoolHaveStaffHostel, "N", new { onclick = " EducatorRadio_Click()", name = "tblHostel.charSchoolHaveLearnerHostel", id = "rdoaccommodationN" })No
@Html.ValidationMessageFor(model => model.charSchoolHaveStaffHostel)
</td>
</tr>
<tr>
<td colspan="2">
<h4>If the School has a hostel,please supply the following information</h4>
</td>
</tr>
<tr>
<td>Hostel Type</td>
<td>
@Html.RadioButtonFor(model => model.intHostelTypeID, "1", new { disabled = "disabled", name = "rdoHostelType", id = "rdoHostelTypePub" })Public
@Html.RadioButtonFor(model => model.intHostelTypeID, "2", new { disabled = "disabled" })Private
@Html.ValidationMessageFor(model => model.intHostelTypeID)
@*<input type="radio" name="rdoHostelType" id="rdoHostelTypePublic" disabled="disabled"/>Public
<input type="radio" name="rdoHostelType" id="rdoHostelTypePrivate" disabled="disabled" />Private*@
</td>
</tr>
</table>
<table>
<tr>
<td></td>
<th colspan="2" class="div3">Learner</th>
<th colspan="2" class="div3">Educator</th>
</tr>
<tr>
<td></td>
<th class="div3">Male</th>
<th class="div3">Female</th>
<th class="div3">Male</th>
<th class="div3">Female</th>
</tr>
<tr>
<td class="myStyleLabel">How many hostels does the school have?</td>
<td class="myStyleLabel" align="center">
@Html.TextBoxFor(model => model.intLearnerMaleHostel, new { disabled = "disabled", maxlength = 4, onkeypress = "return validate(event)", @class = "myStyle" })
@Html.ValidationMessageFor(model => model.intLearnerMaleHostel)
</td>
@*<input type="text" id="txtHostelsLM" class="textbox" disabled="disabled" onkeypress="return validate(event)" maxlength="2" /></td>*@
<td class="myclass" align="center">
@Html.TextBoxFor(model => model.intLearnerFemaleHostel, new { disabled = "disabled", maxlength = 4, onkeypress = "return validate(event)", @class = "myStyle" })
@Html.ValidationMessageFor(model => model.intLearnerFemaleHostel)
</td>
@* <input type="text" id="txtHostelsLF" class="textbox" disabled="disabled" onkeypress="return validate(event)" maxlength="2" /></td>*@
<td class="myclass" align="center">
@* <input type="text" id="txtHostelsEM" class="textbox" disabled="disabled" onkeypress="return validate(event)" maxlength="2" /></td>*@
@Html.TextBoxFor(model => model.intEducatorMaleHostel, new { disabled = "disabled", maxlength = 4, onkeypress = "return validate(event)", @class = "myStyle" })
@Html.ValidationMessageFor(model => model.intEducatorMaleHostel)
</td>
<td class="myclass">
@*<input type="text" id="txtHostelsEF" class="textbox" disabled="disabled" onkeypress="return validate(event)" maxlength="2" /></td>*@
@Html.TextBoxFor(model => model.intEducatorFemaleHostel, new { disabled = "disabled", maxlength = 4, onkeypress = "return validate(event)", @class = "myStyle" })
@Html.ValidationMessageFor(model => model.intEducatorFemaleHostel)
</td>
</tr>
<tr>
<td>Number of beds available (capacity)?</td>
<td>
@* <input type="text" id="txtBedsLM" class="textbox" disabled="disabled" onkeypress="return validate(event)" maxlength="2" /></td>*@
@Html.TextBoxFor(model => model.intLearnerMaleBeds, new { disabled = "disabled", maxlength = 4, onkeypress = "return validate(event)", @class = "myStyle" })
@Html.ValidationMessageFor(model => model.intLearnerMaleBeds)
</td>
<td>
@*<input type="text" id="txtBedsLF" class="textbox" disabled="disabled" onkeypress="return validate(event)" maxlength="2"/></td>*@
@Html.TextBoxFor(model => model.intLearnerFemaleBeds, new { disabled = "disabled", maxlength = 4, onkeypress = "return validate(event)", @class = "myStyle" })
@Html.ValidationMessageFor(model => model.intLearnerFemaleBeds)
</td>
<td>
@*<input type="text" id="txtBedsEM" class="textbox" disabled="disabled" onkeypress="return validate(event)" maxlength="2"/>*@
@Html.TextBoxFor(model => model.intEducatorMaleBeds, new { disabled = "disabled", maxlength = 4, onkeypress = "return validate(event)", @class = "myStyle" })
@Html.ValidationMessageFor(model => model.intEducatorMaleBeds)
</td>
<td>
@* <input type="text" id="txtBedsEF" class="textbox" disabled="disabled" onkeypress="return validate(event)" maxlength="2"/>*@
@Html.TextBoxFor(model => model.intEducatorFemaleBeds, new { disabled = "disabled", maxlength = 4, onkeypress = "return validate(event)", @class = "myStyle" })
@Html.ValidationMessageFor(model => model.intEducatorFemaleBeds)
</td>
</tr>
<tr>
<td>How many boarders are there from your Schools?</td>
<td>
@* <input type="text" id="txtboardersyourSchoolLM" class="textbox" disabled="disabled" onkeypress="return validate(event)" maxlength="2" />*@
@Html.TextBoxFor(model => model.intLearnerMaleBoarders, new { disabled = "disabled", maxlength = 4, onkeypress = "return validate(event)", @class = "myStyle" })
@Html.ValidationMessageFor(model => model.intLearnerMaleBoarders)
</td>
<td>
@*<input type="text" id="txtboardersyourSchoolLF" class="textbox" disabled="disabled" onkeypress="return validate(event)" maxlength="2"/></td>*@
@Html.TextBoxFor(model => model.intLearnerFemaleBoarders, new { disabled = "disabled", maxlength = 4, onkeypress = "return validate(event)", @class = "myStyle" })
@Html.ValidationMessageFor(model => model.intLearnerFemaleBoarders)
<td>
@* <input type="text" id="txtboardersyourSchoolEM" class="textbox" disabled="disabled" onkeypress="return validate(event)" maxlength="2"/></td>*@
@Html.TextBoxFor(model => model.intEducatorMaleBoarders, new { disabled = "disabled", maxlength = 4, onkeypress = "return validate(event)", @class = "myStyle" })
@Html.ValidationMessageFor(model => model.intEducatorMaleBoarders)
<td>
@* <input type="text" id="txtboardersyourSchoolEF" class="textbox" disabled="disabled" onkeypress="return validate(event)" maxlength="2"/>*@
@Html.TextBoxFor(model => model.intEducatorFemaleBoarders, new { disabled = "disabled", maxlength = 4, onkeypress = "return validate(event)", @class = "myStyle" })
@Html.ValidationMessageFor(model => model.intEducatorFemaleBoarders)
</td>
</tr>
<tr>
<td>How many boarders are there from other Schools?</td>
<td>
@* <input type="text" id="txtboardersOtherSchoolLM" class="textbox" disabled="disabled" onkeypress="return validate(event)" maxlength="2" /></td>*@
@Html.TextBoxFor(model => model.intOtherLearnerMaleBoarders, new { disabled = "disabled", maxlength = 4, onkeypress = "return validate(event)", @class = "myStyle" })
@Html.ValidationMessageFor(model => model.intOtherLearnerMaleBoarders)
</td>
<td>
@*<input type="text" id="txtboardersOtherSchoolLF" class="textbox" disabled="disabled" onkeypress="return validate(event)" maxlength="2"/></td>*@
@Html.TextBoxFor(model => model.intOtherLearnerFemaleBoarders, new { disabled = "disabled", maxlength = 4, onkeypress = "return validate(event)", @class = "myStyle" })
@Html.ValidationMessageFor(model => model.intOtherLearnerFemaleBoarders)
</td>
<td>
@*<input type="text" id="txtboardersOtherSchoolEM" class="textbox" disabled="disabled" onkeypress="return validate(event)" maxlength="2"/></td>*@
@Html.TextBoxFor(model => model.intOtherEducatorMaleBoarders, new { disabled = "disabled", maxlength = 4, onkeypress = "return validate(event)", @class = "myStyle" })
@Html.ValidationMessageFor(model => model.intOtherEducatorMaleBoarders)
</td>
<td>
@*<input type="text" id="txtboardersOtherSchoolEF" class="textbox" disabled="disabled" onkeypress="return validate(event)" maxlength="2"/></td>*@
@Html.TextBoxFor(model => model.intOtherEducatorFemaleBoarders, new { disabled = "disabled", maxlength = 4, onkeypress = "return validate(event)", @class = "myStyle" })
@Html.ValidationMessageFor(model => model.intOtherEducatorFemaleBoarders)
</td>
</tr>
</table>
<table>
<tr>
<td style="width: 350px">Does the hostels have indoor water supply?</td>
<td>
@*<input type="radio" name="rdohostelWaterSupply" id="rdohostelWaterSupplyY" disabled="disabled" />Yes
<input type="radio" name="rdohostelWaterSupply" id="rdohostelWaterSupplyN" disabled="disabled" />No*@
@Html.RadioButtonFor(model => model.charHostelHaveWaterFacility, "Y", new { disabled = "disabled", name = "rdWaterSupply", id = "rdWaterSupplyY" })Yes
@Html.RadioButtonFor(model => model.charHostelHaveWaterFacility, "N", new { disabled = "disabled" })No
@Html.ValidationMessageFor(model => model.charHostelHaveWaterFacility)
</td>
</tr>
<tr>
<td>Does the hostels have a water meter?</td>
<td>
@*<input type="radio" name="rdohostelWatermeter" id="rdohostelWatermeterY" disabled="disabled">Yes
<input type="radio" name="rdohostelWatermeter" id="rdohostelWatermeterN" disabled="disabled" />No*@
@Html.RadioButtonFor(model => model.charHostelHaveWaterMeter, "Y", new { disabled = "disabled", name = "rdWaterMeter", id = "rdWaterMeterY" })Yes
@Html.RadioButtonFor(model => model.charHostelHaveWaterMeter, "N", new { disabled = "disabled" })No
@Html.ValidationMessageFor(model => model.charHostelHaveWaterMeter)
</td>
</tr>
<tr>
<td>Does the hostels have electricity?</td>
<td>
@*<input type="radio" name="rdohostelelectricity" id="rdohostelelectricityY" disabled="disabled" />Yes
<input type="radio" name="rdohostelelectricity" id="rdohostelelectricityN" disabled="disabled"/>No*@
@Html.RadioButtonFor(model => model.charHostelHaveElectricity, "Y", new { disabled = "disabled", name = "rdElectricity", id = "rdElectricityY" })Yes
@Html.RadioButtonFor(model => model.charHostelHaveElectricity, "N", new { disabled = "disabled" })No
@Html.ValidationMessageFor(model => model.charHostelHaveElectricity)
</td>
</tr>
<tr>
<td>Does the hostels have a power meter?</td>
<td>
@* <input type="radio" name="rdohostelPowermeter" id="rdohostelPowermeterY" disabled="disabled" />Yes
<input type="radio" name="rdohostelPowermeter" id="rdohostelPowermeterN" disabled="disabled" />No*@
@Html.RadioButtonFor(model => model.charHostelHavePowerMeter, "Y", new { disabled = "disabled", name = "rdPowerMeter", id = "rdPowerMeterY" })Yes
@Html.RadioButtonFor(model => model.charHostelHavePowerMeter, "N", new { disabled = "disabled" })No
@Html.ValidationMessageFor(model => model.charHostelHavePowerMeter)
</td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
@*<tr>
<td></td>
<td></td>
<td style="text-align:right" ><input type="submit" value="Save" id="btn3Save" class="submitbutton" /></td>
<td><input type="submit" value="Cancel" id="btn3Cancel" class="submitbutton"/></td>
</tr>*@
<tr>
<td></td>
<td></td>
</tr>
</table>
and I am calling JavaScript functions in this view as follows
unction LearnerRadio_Click() {
var radio1 = document.getElementById("rdohostelY");
//var radio2 = document.getElementById("charSchoolHaveLearnerHostel");
var radio2 = document.getElementById("rdoaccommodationY");
if (radio1.checked == true) {
document.getElementById("intLearnerMaleHostel").disabled = false;
document.getElementById("intLearnerFemaleHostel").disabled = false;
document.getElementById("intLearnerMaleBeds").disabled = false;
document.getElementById("intLearnerFemaleBeds").disabled = false;
document.getElementById("intLearnerMaleBoarders").disabled = false;
document.getElementById("intLearnerFemaleBoarders").disabled = false;
document.getElementById("intOtherLearnerMaleBoarders").disabled = false;
document.getElementById("intOtherLearnerFemaleBoarders").disabled = false;
}
else {
if (radio1.checked == false) {
document.getElementById("intLearnerMaleHostel").disabled = true;
document.getElementById("intLearnerFemaleHostel").disabled = true;
document.getElementById("intLearnerMaleBeds").disabled = true;
document.getElementById("intLearnerFemaleBeds").disabled = true;
document.getElementById("intLearnerMaleBoarders").disabled = true;
document.getElementById("intLearnerFemaleBoarders").disabled = true;
document.getElementById("intOtherLearnerMaleBoarders").disabled = true;
document.getElementById("intOtherLearnerFemaleBoarders").disabled = true;
document.getElementById("intLearnerMaleHostel").value = "";
document.getElementById("intLearnerFemaleHostel").value = "";
document.getElementById("intLearnerMaleBeds").value = "";
document.getElementById("intLearnerFemaleBeds").value = "";
document.getElementById("intLearnerMaleBoarders").value = "";
document.getElementById("intLearnerFemaleBoarders").value = "";
document.getElementById("intOtherLearnerMaleBoarders").value = "";
document.getElementById("intOtherLearnerFemaleBoarders").value = "";
}
}
if (radio1.checked == true || radio2.checked == true) {
document.getElementById("rdWaterSupplyY").disabled = false;
document.getElementById("rdWaterMeterY").disabled = false;
document.getElementById("rdElectricityY").disabled = false;
document.getElementById("rdPowerMeterY").disabled = false;
document.getElementById("charHostelHaveWaterFacility").disabled = false;
document.getElementById("charHostelHaveWaterMeter").disabled = false;
document.getElementById("charHostelHaveElectricity").disabled = false;
document.getElementById("charHostelHavePowerMeter").disabled = false;
document.getElementById("rdoHostelTypePub").disabled = false;
document.getElementById("intHostelTypeID").disabled = false;
}
else
{
document.getElementById("rdWaterSupplyY").disabled = true;
document.getElementById("charHostelHaveWaterFacility").disabled = true;
document.getElementById("rdWaterMeterY").disabled = true;
document.getElementById("charHostelHaveWaterMeter").disabled = true;
document.getElementById("rdElectricityY").disabled = true;
document.getElementById("charHostelHaveElectricity").disabled = true;
document.getElementById("rdPowerMeterY").disabled = true;
document.getElementById("charHostelHavePowerMeter").disabled = true;
document.getElementById("rdoHostelTypePub").disabled = true;
document.getElementById("intHostelTypeID").disabled = true;
document.getElementById("rdWaterSupplyY").checked = false;
document.getElementById("charHostelHaveWaterFacility").checked = false;
document.getElementById("rdWaterMeterY").checked = false;
document.getElementById("charHostelHaveWaterMeter").checked = false;
document.getElementById("rdElectricityY").checked = false;
document.getElementById("charHostelHaveElectricity").checked = false;
document.getElementById("rdPowerMeterY").checked = false;
document.getElementById("charHostelHavePowerMeter").checked = false;
document.getElementById("rdoHostelTypePub").checked = false;
document.getElementById("intHostelTypeID").checked = false;
}
}
function EducatorRadio_Click() {
var radio1 = document.getElementById("rdohostelY");
var radio2 = document.getElementById("rdoaccommodationY");
if (radio2.checked == true) {
document.getElementById("intEducatorMaleHostel").disabled = false;
document.getElementById("intEducatorFemaleHostel").disabled = false;
document.getElementById("intEducatorMaleBeds").disabled = false;
document.getElementById("intEducatorFemaleBeds").disabled = false;
document.getElementById("intEducatorMaleBoarders").disabled = false;
document.getElementById("intEducatorFemaleBoarders").disabled = false;
document.getElementById("intOtherEducatorMaleBoarders").disabled = false;
document.getElementById("intOtherEducatorFemaleBoarders").disabled = false;
}
else {
if (radio2.checked == false) {
document.getElementById("intEducatorMaleHostel").disabled = true;
document.getElementById("intEducatorFemaleHostel").disabled = true;
document.getElementById("intEducatorMaleBeds").disabled = true;
document.getElementById("intEducatorFemaleBeds").disabled = true;
document.getElementById("intEducatorMaleBoarders").disabled = true;
document.getElementById("intEducatorFemaleBoarders").disabled = true;
document.getElementById("intOtherEducatorMaleBoarders").disabled = true;
document.getElementById("intOtherEducatorFemaleBoarders").disabled = true;
document.getElementById("intEducatorMaleHostel").value = "";
document.getElementById("intEducatorFemaleHostel").value = "";
document.getElementById("intEducatorMaleBeds").value = "";
document.getElementById("intEducatorFemaleBeds").value = "";
document.getElementById("intEducatorMaleBoarders").value = "";
document.getElementById("intEducatorFemaleBoarders").value = "";
document.getElementById("intOtherEducatorMaleBoarders").value = "";
document.getElementById("intOtherEducatorFemaleBoarders").value = "";
}
}
if (radio1.checked == true || radio2.checked == true) {
document.getElementById("rdWaterSupplyY").disabled = false;
document.getElementById("rdWaterMeterY").disabled = false;
document.getElementById("rdElectricityY").disabled = false;
document.getElementById("rdPowerMeterY").disabled = false;
document.getElementById("charHostelHaveWaterFacility").disabled = false;
document.getElementById("charHostelHaveWaterMeter").disabled = false;
document.getElementById("charHostelHaveElectricity").disabled = false;
document.getElementById("charHostelHavePowerMeter").disabled = false;
document.getElementById("rdoHostelTypePub").disabled = false;
document.getElementById("intHostelTypeID").disabled = false;
}
else
{
document.getElementById("rdWaterSupplyY").disabled = true;
document.getElementById("charHostelHaveWaterFacility").disabled = true;
document.getElementById("rdWaterMeterY").disabled = true;
document.getElementById("charHostelHaveWaterMeter").disabled = true;
document.getElementById("rdElectricityY").disabled = true;
document.getElementById("charHostelHaveElectricity").disabled = true;
document.getElementById("rdPowerMeterY").disabled = true;
document.getElementById("charHostelHavePowerMeter").disabled = true;
document.getElementById("rdoHostelTypePub").disabled = true;
document.getElementById("intHostelTypeID").disabled = true;
document.getElementById("rdWaterSupplyY").checked = false;
document.getElementById("charHostelHaveWaterFacility").checked = false;
document.getElementById("rdWaterMeterY").checked = false;
document.getElementById("charHostelHaveWaterMeter").checked = false;
document.getElementById("rdElectricityY").checked = false;
document.getElementById("charHostelHaveElectricity").checked = false;
document.getElementById("rdPowerMeterY").checked = false;
document.getElementById("charHostelHavePowerMeter").checked = false;
document.getElementById("rdoHostelTypePub").checked = false;
document.getElementById("intHostelTypeID").checked = false;
}
}
function StaffHouses_Click() {
var radio1 = document.getElementById("rdoSchStaffHousesY");
var radio2 = document.getElementById("charSchoolHaveStaffHouses");
if (radio1.checked == true) {
document.getElementById("intStaffHousesCount").disabled = false;
document.getElementById("intWorkersCountInStaffHouses").disabled = false;
}
else {
document.getElementById("intStaffHousesCount").disabled = true;
document.getElementById("intWorkersCountInStaffHouses").disabled = true;
document.getElementById("intStaffHousesCount").value = "";
document.getElementById("intWorkersCountInStaffHouses").value = "";
$('#intStaffHousesCount .input-validation-error').addClass('input-validation-valid');
$('#intStaffHousesCount .input-validation-error').removeClass('input-validation-error');
$('#intStaffHousesCount .field-validation-error').addClass('field-validation-valid');
$('#intStaffHousesCount .field-validation-error').removeClass('field-validation-error');
$('#intStaffHousesCount .validation-summary-errors').addClass('validation-summary-valid');
$('#intStaffHousesCount .validation-summary-errors').removeClass('validation-summary-errors');
//$('#field-validation-error ui-state-error-icon ui-icon-alert').removeClass.
//document.getElementById("intStaffHousesCount").onerror.value.disabled = true;
}
}
So In this I want to clear the validation errors when the control is in disable mode i.e when the radio button which is mentioned in the starting when we click on no 2 textboxes should be disabled and error providers should be cleared.So please provide solution for this??
Thanks in advance