jQuery Script in user control, runs for only one instance of that control on the page

Question

I have an CollapsiblePanelExtender control with gridview which i put inside a user control.

I add the following script to the end of the User control to smooth out the animation:

<script type="text/javascript">

    function pageLoad(sender, args) {
        $find(("<%= CPE.ClientID %>"))._animation._fps = 35;
        $find(("<%= CPE.ClientID %>"))._animation._duration = 0.5;
    }

</script>

When i run the page only the 2nd accordion gets smoothed out, the first one is default sluggishness.

The following is the runtime scripts:

<script type="text/javascript">

    function pageLoad(sender, args) {
        $find(("MainContent_AccordionGV1_CPE"))._animation._fps = 35;
        $find(("MainContent_AccordionGV1_CPE"))._animation._duration = 0.5;
    }

</script>

. . . .

    function pageLoad(sender, args) {
        $find(("MainContent_AccordionGV2_CPE"))._animation._fps = 35;
        $find(("MainContent_AccordionGV2_CPE"))._animation._duration = 0.5;
    }

</script>

So it should be working according to this. Any idea why it isn't?

Thanks.

Addition:

I tried manually adding it to the Page instead of the User Control, same behaviour.

    <script type="text/javascript">

        function pageLoad(sender, args) {
            $find(('<%= AccordionGV1.FindControl("CPE").ClientID %>'))._animation._fps = 35;
            $find(('<%= AccordionGV1.FindControl("CPE").ClientID %>'))._animation._duration = 0.5;
        }
</script>

works when i add the same lines but for AccordionGV2..the first one stops working.

Makes me think it is a bigger problem than that.

Answer 1

You should use this script in UserControl instead:

(function () {
    Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(pageLoadedHandler);

    function pageLoadedHandler() {
        $find(("<%= CPE.ClientID %>"))._animation._fps = 35;
        $find(("<%= CPE.ClientID %>"))._animation._duration = 0.5;
    }
})();

This way each user control won't override pageLoad function defined before and will use own handler for pageLoaded event