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

时间:2013-05-15 07:53:45

标签: c# javascript jquery

这是我的代码:

 <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它工作正常时,任何人都知道这个解决方案吗?

3 个答案:

答案 0 :(得分:7)

问题是jQuery UI将对话框附加到正文,而不是表单。 ASP.Net控件需要在表单内部才能运行,但幸运的是,这很容易修复。像这样修改你的jQuery:

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

答案 1 :(得分:1)

这会对你有所帮助

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

答案 2 :(得分:0)

亲爱的朋友,如果您正在使用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

    });
相关问题