I have a page that loads a playlist of songs. The individual songs in the playlist are capable of being dragged around the playlist with jquery. The page also incorporates server side sorting with an ajax update panel. the problem is that after i do a server side sort, the jquery methods don't work anymore.
do the jquery methods get re-attached to the document after the asp.net ajax panel updates the page?
If the elements are replaced by the ajax update, and the jquery event bindings that make the drag work are on the elements themselves, then yes, the event bindings won't be there on the new elements.
One option is to re-run, in the ajax success callback, whatever initialization method creates those event bindings. Another option is to use jQuery's delegate() method to bind those event handlers to any element within a given container that matches a selector (even if it's added after the bindings are set up).
There is a problem exists if we are using an updatepanel.So we need to add the javascript from server side each time the page loads .this can be done by adding all your javascript codes in to a string variable and adds it using ScriptManager.RegisterStartupScript(this, this.GetType(), "validation", script, false); Please go to http://msdn.microsoft.com/en-us/library/system.web.ui.scriptmanager.registerstartupscript.aspx/" to get more information about the function and its arguments.
You can make a function like this
private void addScript()
{
string script = @"<script type=""text/javascript"" language=""javascript"">
javascript function including jquery
</script>";
ScriptManager.RegisterStartupScript(this, this.GetType(), "validation", script, false);
}
All the javascript function will be added in the string script.
Call the function in pageload.So it will again adds to the page.
I think this will solves the problem.
do the jquery methods get re-attached to the document after the asp.net ajax panel updates the page?
The short answer is not if they are being bound in the document.ready event. A "quick and dirty" fix is to use pageLoad. Check out this forum thread.
i'm sure u'll be more happy to use .load
$("body").append("<div style='display:none;'></div>");
$("div:last").load("url.aspx?id=1", function(response, status, xml){ ...do stuff });
i alway have problem with $.ajax annoying, lots of aruments and conflict
if your update panel is broke, u still can post back by using javascript __doPostBack(elmID, args);
