Damien
Damien

Reputation: 14057

Maintaining JavaScript Code in the <Head> after ASP.Net Postback.

As the title suggests, I am having trouble maintaining my code on postback. I have a bunch of jQuery code in the Head section and this works fine until a postback occurs after which it ceases to function!

How can I fix this? Does the head not get read on postback, and is there a way in which I can force this to happen?

JavaScript is:

        <script type="text/javascript">
        $(document).ready(function()
        {
            $('.tablesorter tbody tr').tablesorter();

        $('.tablesearch tbody tr').quicksearch({
            position: 'before',
            attached: 'table.tablesearch',
            stripeRowClass: ['odd', 'even'],
            labelText: 'Search:',
            delay: 100
        });
       }); 
        </script>

Upvotes: 3

Views: 2588

Answers (5)

Russ Cam
Russ Cam

Reputation: 125538

put your code in

function pageLoad(sender, args) {

    /* code here */

}

instead of in $(document).ready(function() { ... });

pageLoad() is a function that will execute after all postbacks, synchronous and asynchronous. See this answer for more details

Upvotes: 2

Reputation:

Instead of using $(document).ready you should put your code in a function called pageLoad(). The pageLoad() function is by convention wired up to be called whenever the page has a postback/asyncpostback.

Upvotes: 0

Kon
Kon

Reputation: 27451

  1. Does the script exist in the HTML code after the postback?
  2. If so, does the code get executed? Test by commenting out your code and temporarily add alert('test');
  3. If so, are the elements referenced by the code available on the page after postback?

Upvotes: 1

Justin Bozonier
Justin Bozonier

Reputation: 7712

If you just have that code hard coded into your page's head then a post back won't affect it. I would check the following by debugging (FireBug in FireFox is a good debugger):

  • Verify the script is still in the head on postback.
  • verify that the css classes are in fact attached to some element in the page.
  • verify that the jquery code is executing after the browser is done loading on post back.

EDIT: Are you using UpdatePanels for your post back? In other words is this an asynchronous postback or a normal full page refresh?

EDIT EDIT: AHhhhh... Ok. So if you're using UpdatePanels then the document's ready state is already in the ready so that portion of jquery code won't be fired again. I would extract the jquery delegate out to a separate function that you can also call after the async postback.

Upvotes: 6

Joel Coehoorn
Joel Coehoorn

Reputation: 416131

I'm guessing that the postback pre-empts the page's onLoad event, which jQuery needs to hook into to use it's .ready().

Upvotes: 1

Related Questions