jquery模式弹出中未触发按钮点击事件

本文关键字：按钮 事件 模式 jquery | 更新日期: 2023-09-27 18:25:23

我已经实现了一个jquery模式弹出

Jquery代码：-

<script type="text/javascript">
    $(function(){
     $('#<%=a2.ClientID %>').click(function(){
     $('#modelPopup').dialog({
     title: "Add New Server",
     width:650,
     height:450,
     modal:true,
     buttons:{
      Close:function(){
      $(this).dialog('close');
      }
     }
     });
    });    
    })
    </script>

Html:-

<asp:Button ID="btnAddNewServic" Text="Add Service" runat="server" 
 CssClass="btnSmall_bg_green" Height="26px" Width="98px" OnClick="btnAddNewServic_Click" />

代码隐藏：-

 protected void btnAddNewServic_Click(object sender, EventArgs e)
        {
            int rowCount = 0;
            rowCount = Convert.ToInt32(Session["clicks"]);
            rowCount++;
            Session["clicks"] = rowCount;
            for (int i = 0; i < rowCount; i++)
            {
                TextBox txtServerU = new TextBox();
                Label lblU = new Label();
                txtServerU.ID = "txtServerU" + i.ToString();
                lblU.ID = "lblU" + i.ToString();
                lblU.Text = "Service" + (i + 1).ToString() + ":";
                panelnewserver.Controls.Add(lblU);
                panelnewserver.Controls.Add(txtServerU);
            }
        }

我找不到这个代码的问题。有人能帮我启动这个按钮点击事件吗。提前谢谢。

更新：-

JQuery代码：-

$(function(){
     $('#<%=a2.ClientID %>').click(function(){
     var $dialog= $('#modelPopup').dialog({
     autoopen:false,     
     title: "Add New Server",
     width:650,
     height:450,
     modal:true,        
     buttons:{
      Close:function(){
      $(this).dialog('close');
      }
     }     
     });
      $dialog.parent().appendTo($("form:first"));
      return false;
    });    
    })
    </script>

现在按钮点击事件被触发，但在完成我的过程后，模式弹出窗口将自动关闭。有人能帮我克服这个问题吗。

jquery模式弹出中未触发按钮点击事件

从内存中，我相信jQueryUI对话框在显示它们时实际上会将对话框元素从DOM中移除。因为这会导致btnAddNewServic从form中移出，所以回发将不会正确触发。

因此，像这样的东西可能会对你的JavaScript有用：

$(function(){
    var $dialog = $('#modelPopup');
    $dialog.dialog({
        autoOpen: false,
        title: "Add New Server",
        width:650,
        height:450,
        modal:true,
        buttons:{
            Close:function(){
                $(this).dialog('close');
            }
        }
    });
    $dialog.parent().appendTo($("form:first"));
    $('#<%=a2.ClientID %>').click(function(){
        $dialog.dialog('open');
    });    
})

这样做的目的是在创建对话框后将其添加回表单中，因此现在应该运行回发。

根据文档，按钮应该在一个数组中。

<script type="text/javascript">
    $(function(){
        $('#<%=a2.ClientID %>').click(function(){
            $('#modelPopup').dialog({
                title: "Add New Server",
                width:650,
                height:450,
                modal:true,
                buttons: [
                    {
                        text: "Close",
                        click: function(){
                            $(this).dialog('close');
                        }
                    }
                ]
            });
        });    
    })
</script>
相关文章：