下拉列表文本框必填字段验证器错误

Question

我有一个来自数据库的值的下拉列表。有一个选项名称 OTHER，当我选择其他时，会出现文本框。对于那个文本框，我制作了一个必填字段验证器。直到这里它工作正常。但是当我选择任何其他选项时，它仍然会给我验证器错误。它不应该发生。只有当用户在选择 OTHER 选项时没有填写文本框时，它才会给我必填字段错误。请看代码。

下拉菜单和文本框代码：-

<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代码：-

<script 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();
            }
        });

Answer 1

只有在文本框可见时才需要启用必填字段验证器，显示文本框时需要在 javascriot 函数中编写以下代码行：

ValidatorEnable(document.getElementById("reqGraduation"), true); 

你的 javascript 代码应该是这样的：

function pageLoad() {
        $('#ctl00_ContentPlaceHolder1_txtOther').hide();
        $('#ctl00_ContentPlaceHolder1_ddlGraduation').change(function () {
            if ($(this).val() === "Other") {
                $('#ctl00_ContentPlaceHolder1_txtOther').show();

               ValidatorEnable(document.getElementById("reqGraduation"), true); 
                // $("#ctl00_ContentPlaceHolder1_ddlGraduation").hide();
            } else {
                $('#ctl00_ContentPlaceHolder1_txtOther').hide();

                ValidatorEnable(document.getElementById("reqGraduation"), false); 
            }
        });