Fill JQuery UI Dialog From Server (Database)

Question

I have Jquery Ui Dialog Like this :

<script type="text/javascript">
    $(document).ready(function () {

        $(document).mousemove(function (e) {
            x = e.pageX;
            y = e.pageY;
            $("#d").dialog({
                autoOpen: false,
                show: "blind",
                hide: "explode",
                position: [e.pageX, e.pageY],

                open: function (type, data) {
                    //Fill Dialog From Server
                }

            });
        });

        $("#c").bind("mouseover", function () {
            $("#d").dialog('open'); // open
        });
        $("#c").bind("mouseleave", function () {
            $("#d").dialog('close'); // open
        });
    });
</script>

How can i load some data from server dynamic ? in asp.net

in case you're gonna switch to asp.net mvc look here awesome.codeplex.com, at the Popup and PopupForm helpers — Omu
– Omu, Commented Dec 29, 2010 at 9:05

Nick Craver · Accepted Answer · 2010-12-29 08:54:52Z

2

The call is fairly simple, just get ASP.Net to return only what content should be in the dialog, not an entire <html>....</html> page. The load can be as simple as using .load(), like this:

open: function () {
  $(this).load("MyDialogContent.aspx");
}

...or it can be a web service call which an return either HTML or JSON, etc...you have a lot of options here.

answered Dec 29, 2010 at 8:54

Nick Craver

631k138 gold badges1.3k silver badges1.2k bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Shahin · Accepted Answer · 2010-12-30 13:31:50Z

i found solution

<WebMethod()> _
Public Shared Function GetInfoByMprID(ByVal mprID As String) As String

    Return resualt
End Function

<script type="text/javascript">
    $(document).ready(function () {

        $(document).mousemove(function (e) {
            x = e.pageX;
            y = e.pageY;
            $("#d").dialog({
                autoOpen: false,
                width: 'auto',
                show: "blind",
                hide: "explode",
                position: [e.pageX, e.pageY],

                open: function (type, data) {
                    $.ajax({
                        type: "POST",
                        url: "Constants.aspx/GetInfoByMprID",
                        data: "{'mprID': '" + 158 + "'}",
                        contentType: "application/json; charset=utf-8",
                        dataType: "json",
                        success: function (msg) {
                            //alert(msg.d);
                            //$('lbl').val() = msg.d;
                            $("#d").empty();
                            $("#d").append('<p>' + msg.d + '</p>');
                        },
                        error: AjaxFailed
                    });
                }

            });
        });

        $("#c").bind("mouseover", function () {
            $("#d").dialog('open'); // open
        });
        $("#c").bind("mouseleave", function () {
            $("#d").dialog('close'); // open
        });
    });
</script>

Collectives™ on Stack Overflow

Fill JQuery UI Dialog From Server (Database)

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related