ASP CustomValidator失败并且无法从屏幕清除Modal

时间:2018-09-19 03:07:35

标签: javascript c# jquery asp.net customvalidator

我正在向表单添加一个新字段。该表单用于将状态从“未批准”更新为“已批准”。目的是确保如果未进行任何更改但单击了“更新”按钮,则显示错误并且不处理任何更新。在添加新字段并将其从RequiredFieldValidator切换为CustomValidator之前,此方法确实有效。

问题

现在,当对下拉菜单未进行任何更改时,模式关闭,但其余窗口显示为灰色,应用程序似乎挂起。

这是一次很棒的学习经历。

编辑:

控制台错误

Doc-Comp-Composition-Templates:348 Uncaught TypeError: $(...).ddlCS is not a function
    at ValidateStatusChange_ClientValidate (Doc-Comp-Composition-Templates:348)
    at eval (eval at CustomValidatorEvaluateIsValid (ScriptResource.axd?d=nv7asgRUU0tRmHNR2D6t1FZw7wze8nmx-kJRmw2XEjbK3oXSAIyhKQNPF6n1kyJ-XavItdyBmyr8jQKkgUwJ4hvE-EOowyd5E-dQMLMfuYhYi3DooAGZ6tCMyoNO-1bI0OD14u047d3MStBJK15cjQ2&t=fffffffff974e48e:450), <anonymous>:1:1)
    at HTMLSpanElement.CustomValidatorEvaluateIsValid [as evaluationfunction] (ScriptResource.axd?d=nv7asgRUU0tRmHNR2D6t1FZw7wze8nmx-kJRmw2XEjbK3oXSAIyhKQNPF6n1kyJ-XavItdyBmyr8jQKkgUwJ4hvE-EOowyd5E-dQMLMfuYhYi3DooAGZ6tCMyoNO-1bI0OD14u047d3MStBJK15cjQ2&t=fffffffff974e48e:450)
    at ValidatorValidate (ScriptResource.axd?d=nv7asgRUU0tRmHNR2D6t1FZw7wze8nmx-kJRmw2XEjbK3oXSAIyhKQNPF6n1kyJ-XavItdyBmyr8jQKkgUwJ4hvE-EOowyd5E-dQMLMfuYhYi3DooAGZ6tCMyoNO-1bI0OD14u047d3MStBJK15cjQ2&t=fffffffff974e48e:200)
    at Page_ClientValidate (ScriptResource.axd?d=nv7asgRUU0tRmHNR2D6t1FZw7wze8nmx-kJRmw2XEjbK3oXSAIyhKQNPF6n1kyJ-XavItdyBmyr8jQKkgUwJ4hvE-EOowyd5E-dQMLMfuYhYi3DooAGZ6tCMyoNO-1bI0OD14u047d3MStBJK15cjQ2&t=fffffffff974e48e:119)
    at Sys$WebForms$PageRequestManager$_doPostBackWithOptions [as _doPostBackWithOptions] (ScriptResource.axd?d=JnUc-DEDOM5KzzVKtsL1tRZpRA_LXrniqfBmVmIZ3cAuPpCW1plWZw2RXdO0zo-BiAzza2U9Udple6pVeaDdyS14EzqQJMs1mhrjSf56Z17-S803UF2Z43EZ-6v-WWTiunEhUO4tmGiISgd0nYLoQNVyt3LQvd2TOLU7l5Fq6n-tE3oJIofGXa6OGTnxPRDQ0&t=fffffffffc18b87d:831)
    at ScriptResource.axd?d=D9drwtSJ4hBA6O8UhT6CQi4RxEM3HXQdD1kANRSxcVDQlciZR3AdFzJCI2OSpEJ8btryaMvtylBgqedQo2VFV1HT2WfhU1dHTVqnIz5ypNeiBiXQQMaUQfmxLJUQguR-W97gIReVDFvaBQUHY7tXxFcflqZ4dU-xR3P7jVPaHdY1&t=fffffffffc18b87d:47
    at HTMLInputElement.onclick (Doc-Comp-Composition-Templates:1)

要验证的控件:

<div class="form-group">
  <label for="ddlCS">Current Status:</label>
  <asp:DropDownList ID="ddlCS" runat="server" CssClass="form-control" 
    ToolTip="Choose Status" Enabled="false" ValidationGroup="gStatusChange" />
</div>
<div class="form-group">
  <label for="ddlNS">New Status:</label>
  <asp:DropDownList ID="ddlNS" runat="server" CssClass="form-control"
    ToolTip="Choose Status" ValidationGroup="gStatusChange" />
</div>
<div class="form-group">
  <label for="ddlPA">Proof Approval:</label>
  <asp:DropDownList ID="ddlPA" runat="server" CssClass="form-control"
     Tooltip="Choose Proof Status" ValidationGroup="gStatusChange" />
</div>

<div class="col-sm-3">
    <asp:Button ID="btnUpdate" runat="server" Text="Update Status" 
         CssClass="btn btn-primary pull-left" ToolTip="Save Changes" 
         OnClick="btnUpdate_Click"/>
</div>

验证者:

<asp:CustomValidator ID="custvStatusChange" runat="server" Display="None" 
      ValidationGroup="gStatusChange"
      ErrorMessage="Wow what an error!"
      OnServerValidate="ValidateStatusChange_ServerValidate"  
      ClientValidationFunction="ValidateStatusChange_ClientValidate"/>
<asp:ValidationSummary ID="vscustvStatusChange" runat="server" ToolTip="Error Summary" 
      ShowSummary="true" 
      ShowMessageBox="false" 
      CssClass="alert alert-danger" 
      ValidationGroup="gStatusChange" />

<Triggers>
     <asp:AsyncPostBackTrigger ControlID="gvTemplates" 
          EventName="RowCommand"/>
     <asp:AsyncPostBackTrigger ControlID="btnUpdate" EventName="Click"/>
</Triggers>

服务器端验证:

protected void ValidateStatusChange_ServerValidate(object source, 
   ServerValidateEventArgs args)
    {
        if (ddlCS.SelectedValue == ddlNS.SelectedValue || ddlPA.SelectedIndex == 0)
        {
            args.IsValid = false;
        }
    }

客户端验证:

<script>
    $m = jQuery.noConflict();
</script>
<script type="text/javascript">
    function ValidateStatusChange_ClientValidate(source, args) {
        var cStatus = $(source).ddlCS("select").prop("selectedIndex");
        var nStatus = $(source).ddlNS("select").prop("selectedIndex");
        var pStatus = $(source).ddlPA("select").prop("selectedIndex");

        if (cStatus == nStatus || pStatus == 0) {
            args.IsValid = false;
        } else {
            args.IsValid = true;
        }
    }
    function closeModal() {
        $('#modStatus').modal('hide');
        $('body').removeClass('modal-open');
        $('.modal-backdrop').remove();
    }
    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_endRequest(function () {

        function closeModal() {
            $('#modStatus').modal('hide');
            $('body').removeClass('modal-open');
            $('.modal-backdrop').remove();
        }
    });
 </script>

按钮点击事件:

protected void btnUpdate_Click(object sender, EventArgs e)
        {
            Page.Validate("custvStatusChange");
            if (Page.IsValid)
            {
                #region Template Status change
                if (ddlNS.SelectedIndex > 0)
                {
                    if (ddlCS.SelectedValue != ddlNS.SelectedValue)
                    {
                        if (ddlCS.SelectedValue == "5" && hfProofStatus.Value == "N")
                        {
                            lblUpdateStatus.Text = "Proof must be approved before template can be";
                            lblUpdateStatus.CssClass = "text-danger";
                        }
                        else
                        {
                            ScriptManager.RegisterClientScriptBlock(this, this.GetType(), "Close", "$('#modStatus').modal('hide');$('body').removeClass('modal-open');$('.modal-backdrop').remove();", true);
                            // save and notify
                            DotNetAuth auth = (DotNetAuth)HttpContext.Current.Session["AppSysAuth"];
                            if (CompositionTemplate.UpdateStatus(Convert.ToInt32(hfTemplateID.Value),
                                Convert.ToInt32(ddlNS.SelectedValue), auth.Name, hfFileName.Value))
                            {
                                lblUpdateStatus.Text = "Status change saved";
                                lblUpdateStatus.CssClass = "text-success";
                                BindGrid();
                            }
                            else
                            {
                                lblUpdateStatus.Text = "Error saving status change";
                                lblUpdateStatus.CssClass = "text-danger";
                            }
                        }
                    }
                }
                #endregion
            }
        }

1 个答案:

答案 0 :(得分:0)

ddlCS()函数(也与ddlNS()ddlPA()一起使用)是未定义的,因为它们未在$(source)的jQuery选择器中定义。您应该更改以下行:

var cStatus = $(source).ddlCS("select").prop("selectedIndex");
var nStatus = $(source).ddlNS("select").prop("selectedIndex");
var pStatus = $(source).ddlPA("select").prop("selectedIndex");

下面的这些行,其中每个下拉列表均使用ClientID(由于您未使用ClientIDMode="Static"属性,因此假定使用了动态客户端ID)

var cStatus = $('#<%= ddlCS.ClientID %>').prop("selectedIndex");
var nStatus = $('#<%= ddlNS.ClientID %>').prop("selectedIndex");
var pStatus = $('#<%= ddlPA.ClientID %>').prop("selectedIndex");

或者使用select元素选择器,并将每个下拉列表的id属性设置为ClientID,如下所示:

var cStatus = $('select [id=<%= ddlCS.ClientID %>]').prop("selectedIndex");
var nStatus = $('select [id=<%= ddlNS.ClientID %>]').prop("selectedIndex");
var pStatus = $('select [id=<%= ddlPA.ClientID %>]').prop("selectedIndex");