Question

I want to display a dialog which contains HTML that is dynamically generated:

 $.ajax({
        type: "get",
        url: "http://localhost/example/test",
        dataType: "html",
        success: function (content) {
            $(content).dialog();
        }
    });

content is basically a complete HTML site with header and body. If I change $(content).dialog() to alert(content) the generated HTML is displayed correctly. But content.dialog() throws the following exception on Firefox 5:

a.style is undefined 
Source: http://localhost/TrackerWebStable/Scripts/jquery-1.4.4.min.js
Line: 150

I’ve also tested it with IE8 where I get similar errors.

How can I solve this problem?

Answer 1

content will contain the entire html markup. I believe you want to show some part of it in a dialog. Try to find the required element from the whole html and show it in a dialog.

Alternatively, you can only send the required markup from "http://localhost/example/test so that you dont have to find anything in the success handler but just show it in the dialog.

$.ajax({
        type: "get",
        url: "http://localhost/example/test",
        dataType: "html",
        success: function (content) {
            $(content).find("requiredElement").dialog();
        }
    });