jquery对话框内的更新面板不工作

update panel inside jquery dialog div not working

本文关键字：工作 更新 对话框 jquery      更新时间：2023-09-26

这是我的代码:

 <div id="AddFriendDiv" style="display: none">
        <asp:TextBox ID="FriendParamtxt" runat="server"></asp:TextBox>
        <asp:UpdatePanel ID="upd" runat="server">
        <Triggers>
        <asp:AsyncPostBackTrigger ControlID="SearchFriend_btn" EventName="Click" />
        </Triggers>
          <ContentTemplate>
                <asp:Button ID="SearchFriend_btn" runat="server" OnClick="SearchFriend_btn_Click" Value="Search" />
                <asp:Repeater ID="FriendRequestRepeater" runat="server">
                    <ItemTemplate>
                        <table border="1">
                            <tr>
                                <td>
                                    <img src='<%#Eval("PROFILE_PIC") %>' width="35px" height="35px" alt='<%#Eval("NAME") %>' />
                                </td>
                                <td>
                                    <asp:Label ID="Name_lbl" runat="server" Text='<%#Eval("NAME") %>'></asp:Label>
                                </td>
                                <td>
                                    <input type="hidden" id="requestFriendID_hf" /><input type="button" id="addFreind"
                                        value="Send Request" />
                                </td>
                            </tr>
                        </table>
                    </ItemTemplate>
                </asp:Repeater>
            </ContentTemplate>
        </asp:UpdatePanel>
    </div>

客户端:

 function SendFriendRequest() {
        var dialogOption = { title: "<u>Add Friend</u>", width: 280, height: 140, modal: false, resizable: false, draggable: true,
            maxHeight: 340, autoOpen: true, closeOnEscape: true
        };
        var DialogExtendOptions = { "close": true, "maximize": false, "minimize": true, "dblclick": 'minimize', "titlebar": 'transparent' };
        $("#AddFriendDiv").dialog(dialogOption).dialogExtend(DialogExtendOptions);
       $("#AddFriendDiv").show();

    }

服务器端:

protected void SearchFriend_btn_Click(object sender, EventArgs e)
{
   DataTable frdrequest= new DataTable();
    int clientID =int.Parse( UserID.Value.ToString());
    if (FriendParamtxt.Text != "")
    {
        frdrequest = SQLHelper.GetAllClientByParam(FriendParamtxt.Text, clientID);
      if (frdrequest.Rows.Count > 0)
      {
          FriendRequestRepeater.DataSource = frdrequest;
          FriendRequestRepeater.DataBind();
      }
    }
}

SendFriendRequest被称为外部的一个标签，但问题是，当主div是一个对话框时，按钮单击事件没有触发，但当我将其更改为正常的div时，它工作得很好，有人知道这个的解决方案吗?

问题是jQuery UI将对话框附加到body，而不是表单。ASP。Net控件需要在表单内部才能发挥作用，但幸运的是，这很容易修复。像这样修改jQuery:

$("#AddFriendDiv").dialog(dialogOption)
  .dialogExtend(DialogExtendOptions)
  .parent().appendTo($("form:first"));
$("#AddFriendDiv").show();

这将帮助你

        var dialog = $("#divModal").dialog({
            autoOpen: false,
            height: 515,
            width: 900,
            modal: true,
            draggable: false,
            resizable: false
        });
        dialog.parent().appendTo(jQuery("form:first"));

亲爱的朋友，如果你正在使用ajaxtoolkite和你正在使用updatepanel或scriptmanager然后jquery使冲突与它，所以你可以使用以下2种方法，使你的代码正常工作下面的代码将解决你的问题

    $(document).ready(function() {
// bind your jQuery events here initially
});
    var prm = Sys.WebForms.PageRequestManager.getInstance();
    prm.add_endRequest(function() {
// re-bind your jQuery events here
    });
相关文章：