通过链接按钮弹出“ jQuery对话框”

Question

I have a link button. On clicking on the that linkbutton, I want a dialog box to pop up. I tried a lot but unable to proceed.

Following is the pieces of codes on how I am trying this.

in .cs file : (this is how I dynamically created the link button) (I have used lnkButtons class in my jquery.

LinkButton lnkUpdateComment = new LinkButton();
lnkUpdateComment.ID = "" + objBridgeNotes.BridgeNotesId;
lnkUpdateComment.Text = "edit";
lnkUpdateComment.Attributes.Add("class", "lnkButtons");
lnkUpdateComment.Click += new EventHandler(lnkUpdateComment_Click);

.js file:

$(document).ready(function()  {

$(".lnkButtons").live("click", function()  {
$("#divEditComment").dialog("option", "title", "Edit the Comment");
$("#divEditComment").dialog("open");
return true;
});

$(function () {
var dlg = $("#divEditComment").dialog({
    autoOpen: false,
    show: "blind",
    hide: "blind",
    //height: 450,
    minWidth: 400,
    //position: ['right', 210],
    buttons: {
        "Update Note": function () {

            var Updates = btnSubmitComment.replace(/_/g, '$');
            __doPostBack(Updates, '');
        }
    }
});
dlg.parent().appendTo(jQuery("form:first"));
});

});

in .aspx file:

    <div id="divEditComment">
<asp:UpdatePanel ID="updComments" runat="server">
    <ContentTemplate>
        <div>
            <table width="100%" style="text-align: center">
                <tr>
                    <td>
                        <div id="divComments" runat="server">
                        </div>
                    </td>
                </tr>
            </table>
        </div>
    </ContentTemplate>

</asp:UpdatePanel>

Answer 1

Jquery

$(function () {
    var dlg = $("#divEditComment").dialog({
        autoOpen: false,
        show: "blind",
        hide: "blind",
        //height: 450,
        minWidth: 400,
        //position: ['right', 210],
        buttons: {
            "Update Note": function () {

                var Updates = btnSubmitComment.replace(/_/g, '$');
                __doPostBack(Updates, '');
            }
        }
    });
    dlg.parent().appendTo(jQuery("form:first"));
    });

$(document).ready(function()  {

    $(".lnkButtons").live("click", function()  {
    $("#divEditComment").dialog("open");
    return false;
    });
    });

.aspx

     <div id="divEditComment" title="Edit the comment">
    <asp:UpdatePanel ID="updComments" runat="server">
        <ContentTemplate>
            <div>
                <table width="100%" style="text-align: center">
                    <tr>
                        <td>
                            <div id="divComments" runat="server">
                            </div>
                        </td>
                    </tr>
                </table>
            </div>
        </ContentTemplate>

    </asp:UpdatePanel>
</div>

Answer 2

Just replace return true to return false. It will worked.

 $(document).ready(function()  {

$(".lnkButtons").live("click", function()  {
$("#divEditComment").dialog("option", "title", "Edit the Comment");
$("#divEditComment").dialog("open");
**return false;**
});

$(function () {
var dlg = $("#divEditComment").dialog({
    autoOpen: false,
    show: "blind",
    hide: "blind",
    //height: 450,
    minWidth: 400,
    //position: ['right', 210],
    buttons: {
        "Update Note": function () {

            var Updates = btnSubmitComment.replace(/_/g, '$');
            __doPostBack(Updates, '');
        }
    }
});
dlg.parent().appendTo(jQuery("form:first"));
});

});

------------------- Update ---------------------

LinkButton lnkUpdateComment = new LinkButton(); lnkUpdateComment.ID = "MyBtn" ; lnkUpdateComment.Text = "My name Is khan"; lnkUpdateComment.Attributes.Add("class", "lnkButtons"); YourPlaceholder.Controls.Add(lnkUpdateComment); lnkUpdateComment.Click += new EventHandler(lnkUpdateComment_Click);

$(".lnkButtons").live("click", function() {
        var dlg33 = $("#dialog").dialog({
            title: "Filter records",
            height: "450",
            width: "600",
            maxHeight: "450",
            maxWidth: "600",
            buttons: {
                "Update Note": function() {

                    var Updates = btnSubmitComment.replace(/_/g, '$');
                    __doPostBack(Updates, '');
                }
            }
            });
            dlg33.parent().appendTo(jQuery("form:first"));
            return false;


        });