JQuery Dialog Box with HTML Contents

Question

Im having problems with dialog box. I wanted to display inside the Dialog box the HTML content of the another page. for example.

index.php

 var url = "/leave_ot/statistics.php?what="+type+"&item="+applicant;
   //alert(url);

    $.ajax({
        type    : 'GET',
        url     : url,
        success : function(result)
        {
            $( "#dialog" ).dialog({
                height: 140,
                modal: true
            });
        }
    })

applicant.html

some html codes

I wanted to put the html contents of applicant.html into the dialog box of index.php

And what happens? Error messages in console? What? Where do you process result? — mplungjan
– mplungjan, Commented Dec 13, 2013 at 6:23
@mplungjan Read the code, you can see what happens: it doesn't insert anything anywhere. — Barmar
– Barmar, Commented Dec 13, 2013 at 6:24
If you want applicant.html, why does the URL point to statistics.php? — Barmar
– Barmar, Commented Dec 13, 2013 at 6:25
@Barmar True - I just wanted to explain the user to add such info to the question — mplungjan
– mplungjan, Commented Dec 13, 2013 at 6:26
$("#id_where_the_content_to_be_displayed").html(result);$("#dialog")... — bansi
– bansi, Commented Dec 13, 2013 at 6:27

Community · Accepted Answer · 2017-05-23 12:11:33Z

2

Use the .html() method to insert the HTML result into the DIV.

$.ajax({
    type    : 'GET',
    url     : url,
    success : function(result)
    {
        $( "#dialog" ).dialog({
            height: 140,
            modal: true
        }).html(result);
    }
});

Note that this only works if the URL is in the same domain; cross-domain AJAX prevents using it for other domains. If you need that, you'll have to use an IFRAME; see the answers in How do you open a URL in a dialog box JQUERY UI

edited May 23, 2017 at 12:11

CommunityBot

11 silver badge

answered Dec 13, 2013 at 6:24

Barmar

789k57 gold badges555 silver badges669 bronze badges

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

Collectives™ on Stack Overflow

JQuery Dialog Box with HTML Contents

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related