CODEWITHSUNDEEP
c#asp.netjquery
Ben
Ben

Reputation: 207

Page disappears when scriptmanager calls jquery dialog

I got a problem in my Asp.net application. When I try to save some data, I check if the data is right, When not I call a jquery dialog with the error message. But when my jquery dialog appears, my background form dissapears. and I get a javascript error: "html parsing error unable to modify the parent container element before the child element is closed".

This is my jquery dialog call in codebehind:

    string script = "openDialog('" + text + "', '" + title + "');";
    ScriptManager.RegisterClientScriptBlock(this.Page, this.GetType(), "open", script, true);

This is my jquery dialog in my masterpage:

    function openDialog(text, title) {
    var $dialog = $('<div></div>')
    .html(text)
    .dialog({
        autoOpen: false,
        title: title,
        modal: true,
        height: 100,
        width: 220,
        buttons: {
            Ok: function() {
                $(this).dialog('close');
            }               
        },
        open: function(event, ui){
            $('body').css('overflow','hidden');
        }           
    });

    $dialog.dialog('open');
}

I have some pages where I have the same code and there it works?

Upvotes: 1

Views: 805

Answers (2)

Harry
Harry

Reputation: 1825

WOW! I just realized that the markup of the dialog was within the <form> tag, moved it out and its now working. Seems like VS extended the <form> when I added something and grabbed my stuff into it, too.

<div id="dialog-form" title="Fill Here">

<fieldset>

    <textarea rows="10"  id="myPaste" cols="50"></textarea>

</fieldset>
</div>
<button id="create-user">Click Here</button>

           <asp:Button ID="btnSend" runat="server" Text="Send ALL" 
                onclick="btnSend_Click" Width="127px" />  
</form>

changed it to:

 <asp:Button ID="btnSend" runat="server" Text="Send ALL" 
            onclick="btnSend_Click" Width="127px" /> 
 </form>    

<div id="dialog-form" title="Fill Here">

<fieldset>

    <textarea rows="10"  id="myPaste" cols="50"></textarea>

</fieldset>
</div>

<button id="create-user">Click Here</button>

Upvotes: 4

JumpingJezza
JumpingJezza

Reputation: 5665

According to this link it is likely because the new div you are trying to add is being added before the page has completed rendering. Try this:

string script = "jQuery(document).ready(function($) { openDialog('" + text + "', '" + title + "'); })";

Upvotes: 1

Related Questions