5

On my page I got the following user control:

<div class="editFormDialog" style="display: none; font-size: 12px;">
    <mm:Form ID="editUC" ShowCreateButton="false" ShowEditButton="true" runat="server" />
</div>

This UC has a public property that takes a DataSet, and updates some fields in the UC.

So when I push a button on my page, it calls this property on the UC, and the UC gets updated with data from the DataSet.

So far so good. The problem arise when I want the UC to be a jQuery UI Dialog.

First I create the dialog:

$(document).ready(function() {
    $('.editFormDialog').dialog({
        autoOpen: false,
        height: 700,
        width: 780,
        modal: true,
        bgiframe: true,
        title: 'Rediger',
        open: function(type, data) {
            $(this).parent().appendTo("form");
            $(this).css('display', 'block');
        }
    });
});

And I wan't it to open on a button push (this is not an ASP.NET button, plain HTML):

$('#btnEdit').live('click', function() {
    $('.editFormDialog').dialog('open');
});

The dialog opens, but the UC does not contain the correct data. When the page loads, the UC is updated with default data. Then the user clicks a button, and the data changes but the UC isn't updated. It still contains the default data. Thats the problem.

Do you have any idea why?

Help will be much appreciated!

Improve this question
0

3 Answers 3

Reset to default
2

I found the solution for this issue. It turns out that when you append to the form, you need to make sure this snippet of code is inside jquery document ready:

$("#dialog1").parent().appendTo($("form:first"));

So the whole thing should look like this:

jQuery(document).ready(function() {
    $("#<%=myFamilyGrid.ClientID %>").tablesorter({
        sortList: [[0, 1]]
    })
         .tablesorterPager({ container: $("#pager") });


    $("#dialog1").dialog({
        modal: true,
        height: 370,
        width: "350px",
        autoOpen: false,
        bgiframe: false,
        zIndex: 3999
    });

    $("#dialog1").parent().appendTo($("form:first"));
});

Hope this helps!

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

Comments

1

Exactly what happens when you "call the property" (I would assume you mean it's a method)? Does the page perform a postback? If that's the case, maybe the postback is getting blocked somehow when you mix jQuery into the scenario?

Improve this answer

5 Comments

I click a button to get the next data. A postback occurs. The property in the UC is set like "editUC.EditData = ds;". The page comes up with the new data. Now when I click another button which makes the Dialog popup, the UC still contains the default data. Like it hasn't registered the changes in it's datasource. But if I display the UC outside the dialog, it works perfectly.
That does sound strange: Could you post some more of your source code?
It's all placed inside an update panel. Can it be when I create the dialog, it's "moved outside" the update panel? Maybe another solution could be to create the dialog every time it's beeing opened and then remove it when it's beeing closed? Of course placing the html elements in the right place. But how can I do that?
Well, with jQuery and ASP.NET AJAX playing around like that, I would definately try to simplify things a bit in order to track this down. I'm sorry I can't be of more help. :)
Is there any way to replace ASP.NET AJAX with jQuery AJAX? Any articles on that?
0

Since you are using Update Panels, how are you injecting the call to the javascript in the page? I ask, because there's only one way that work properly on partial postbacks: ScriptManager.RegisterStartupScript(). That allows javascript code to act as if the page was loaded. Of course any other onload javascript may be called too, which may result in the behavior you are seeing.

So,

  1. make sure that your javascript is injected with the script manager.
  2. make sure only the bits of javascript that you want to execute after a partial postback are executed

There is also the possibility of turning your UC in a ajax control with a web service to change the datasource. No more partial postbacks then, which usually improve the responsiveness of the page.

Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.