Hi,
I have a dropdown list for the which values are coming from DB. There is one option name OTHER, when I select other the textbox appears. For that Textbox I have made a required field validator. Till here it works fine. But when I select any other option, still it gives me validator errors. It should not happen. It should only give me required field error when the user doesn't fills the textbox on select of OTHER option. Please see the code.
Dropdown and Textbox code:-
<asp:DropDownList ID="ddlGraduation" runat="server" CssClass="txtfld-popup_drp">
</asp:DropDownList>
<asp:RequiredFieldValidator CssClass="error_msg" ID="reqGraduation" runat="server" ControlToValidate="ddlGraduation" ErrorMessage="Please select graduation details" InitialValue="--Select--" SetFocusOnError="true"></asp:RequiredFieldValidator>
<asp:TextBox ID="txtOther" runat="server" CssClass="txtfld-popup_p"></asp:TextBox>
<asp:RequiredFieldValidator ID="reqOther" runat="server" ControlToValidate="txtOther" ErrorMessage="Please specify your qualification"></asp:RequiredFieldValidator>
JS code for hiding and show the textbox when user select and deselect the OTHER option from dropdown list:-
<script language="javascript" type="text/javascript">
function pageLoad() {
$('#ctl00_ContentPlaceHolder1_txtOther').hide();
$('#ctl00_ContentPlaceHolder1_ddlGraduation').change(function () {
if ($(this).val() === "Other") {
$('#ctl00_ContentPlaceHolder1_txtOther').show();
// $("#ctl00_ContentPlaceHolder1_ddlGraduation").hide();
} else {
$('#ctl00_ContentPlaceHolder1_txtOther').hide();
}
});
</script>
Please help. how to achieve this