String contains an invalid character on jquery-ui dialog

Never happen to me when making a dialog with jquery-ui. I have a div an开发者_JAVA技巧d when I make it a dialog with .dialog I get this error

[Exception... "String contains an invalid character" code: "5" nsresult: "0x80530005 (NS_ERROR_DOM_INVALID_CHARACTER_ERR)" location: "http://localhost/include/jquery-1.5.1.min.js Line: 16"] { constructor=DOMException, code=5, more...}

I have jquery 1.5.1 with UI 1.8.13 custom with all the plugin inside. This is the code for the dialog in document ready

    $("#dialog").dialog({
    bgiframe: true,
    height: 200,
    width: 150,
    modal: false,
    show: 'blind',
    hide: 'blind',
    resizable: false,
    position: [270,150],
    autoOpen: false,
    zIndex: 997,
    buttons: {
        "Reset": function() {
        }
    }
});

and this is the div

<div id="dialog">some text</div>

I am experiencing the exact same problem only difference is that that in my code the whole options is coming from an JSON encoded server response using $.getJson:

$.getJSON(
    '/get-dialog',
    function(r){
        $('<div>' + r.content + '</div>').dialog(r.options);
    }
);

At the moment I added a key called buttons to the r.options object this exact same error appeared.

So the response (r) basicly looks like this:

content
    "<form action="/editor">...</form>"
options
    resizable false
    width 600   
    modal true
    buttons
        Ok "function(){alert('test')}"

Removing the buttons from the r.options makes the error message go away. I tried several different key / values for the buttons but none of that seems to matter.

Using jQuery UI version 1.8.16 and jQuery version 1.6.2 .

After reading some further I found out that we are both making the same mistake. If you look at the jQuery UI Dialog documentation it gives the following example:

$( ".selector" ).dialog({ buttons: [
    {
        text: "Ok",
        click: function() { $(this).dialog("close"); }
    }
] });

(Source: http://jqueryui.com/demos/dialog/)

So you shouldn't be using key / value pairs but a sub array containing the keys text and click.

Since we both where doing this wrong (and I've found others with the same problem) I'm guessing that this has been changed over some version in jQuery UI. I am not sure when it was changed though.

So in your case the correct code would be:

$("#dialog").dialog({
    bgiframe: true,
    height: 200,
    width: 150,
    modal: false,
    show: 'blind',
    hide: 'blind',
    resizable: false,
    position: [270,150],
    autoOpen: false,
    zIndex: 997,
    buttons: [
    {
        text: "Reset",
        click: function() {  }
    }
    ]
});