Question

我有一个asp.net webform应用程序，用户单击一个按钮，然后显示一个包含3个字段的模式。我添加了OnTextChanged和AutoPostBack="true"，因为我有代码，检查在第一个中输入的名称是否存在。但是当我看到我的模态关闭时，我需要它保持打开状态。

我有一个非常类似的手风琴情况，我在Jquery和asp:HiddenField工作，但我尝试改变代码无济于事。

模态的HTML部分

<div class="form-group">
     <asp:Label ID="lblPlace" runat="server" Class="col-sm-3 control-label" Text="Place" AssociatedControlID="fldPlace" />
     <div class="col-sm-6">
          <asp:TextBox ID="fldPlace" runat="server" class="form-control" AutoPostBack="true" OnTextChanged="fldPlace_TextChanged" />
     </div>
</div>

我用于手风琴的代码是

HTML

<asp:HiddenField runat="server" ID="toKeepRemoveAccordionOpen" />
<div class="form-group">        
     <asp:Label runat="server" AssociatedControlID="txtRemoveUser" CssClass="col-sm-offset-2 col-sm-3 control-label">Enter Name To Be Removed</asp:Label>
     <div class="col-sm-3">
          <asp:TextBox runat="server" ID="txtRemoveUser" CssClass="form-control" AutoPostBack="true" OnTextChanged="txtRemoveUser_TextChanged" />
     </div>
</div>

JQuery的

$('document').ready(function ()
{
    var hdnFldId = '<%= toKeepRemoveAccordionOpen.ClientID %>';
    $("#MainContent_txtRemoveUser").on("blur", function ()
    {
        //Sets value of hidden field to show panel after postback
        $('#' + hdnFldId).val(true);
    });

    if ($('#' + hdnFldId).val() == 'true')
    {
        showPanel();
        // Resets the value
        $('#' + hdnFldId).val(false);
    }

    function showPanel()
    {
        if ($('#MainContent_txtRemoveUser').val() != '')
        {
            $('.panel-collapse').removeClass('collapse').addClass('in');
        }
    }
});

我确实尝试了以下JQuery

$('document').ready(function () {
            var hdnFldId = '<%= toKeepRemoveAccordionOpen.ClientID %>';
            $("#MainContent_fldPlace").on("blur", function () {
                //Sets value of hidden field to show panel after postback
                $('#' + hdnFldId).val(true);
            });

            if ($('#' + hdnFldId).val() == 'true') {
                showPanel();
                // Resets the value
                $('#' + hdnFldId).val(false);
            }

            function showPanel() {
                if ($('#MainContent_fldPlace').val() != '') {
                    //$('.modal').addClass('in');
                    $('.modal').removeClass('fade').addClass('fade in');
                }
            }
        });

模式的主要类是modal fade，当它显示时，它会更改为modal fade in。

Answer 1

我建议你使AutoPostBack =“false”并在OnTextChanged上调用WebMethod（后面的代码检查是否在第一个中输入的名称当前是否存在）以避免添加UpdatePanel并重新打开每个部分的模态回发

您可以在此处看到如何将数据发布到WebMethod http://www.aspsnippets.com/Articles/jQuery-AJAX-call-with-parameters-example-Send-parameters-to-WebMethod-in-jQuery-AJAX-POST-call.aspx

Answer 2

要在回发后重新打开模态，您可以使用隐藏字段并根据其值决定是否重新打开模态。假设您使用的是bootstrap模式，代码可能类似于以下内容： -

if ($('#' + hdnFldId).val() ==  "true") {
   $('#myModal').modal('show');
   $('#' + hdnFldId).val(false);
}

上述方法的问题在于，在显示模态时会涉及动画（淡入）。每次回发后，用户都可以看到该动画。

为了解决这个问题，我们可以使用以下代码：

if ($('#' + hdnFldId).val() ==  "true") {
   $('#myModal').addClass("in").attr("aria-hidden", false).css("display", "block");
   $('#myModal').modal('show');   //This will take care of adding all the other elements and classes which modal uses.
   $('#' + hdnFldId).val(false);
}

更好的选择是使用webmethod建议的Aleksey。

Answer 3

在我的aspx页

中添加了以下内容

<强> JQuery的

function keepOpenSuggestPlaceModal()
{
    $('#placesModal').modal('show');
}

并在我的代码中添加了以下函数调用

ScriptManager.RegisterStartupScript(this, this.GetType(), "Pop", "keepOpenSuggestPlaceModal();", true);

当＆＃39; OnTextChanged＆＃39;停止模态关闭火灾

3 个答案: