jquery, asp.net ajax, javascript not executing at all

Question

<script type="text/javascript">
    function pageLoad() {
        var $scrollingDiv = $("#scrollfix");
        $(window).scroll(function () {
            if ($(window).scrollTop() == $(document).height() - $(window).height()) {
                __doPostBack('<%= GetMoreResults.UniqueID %>', '');
            }
            $scrollingDiv
                .stop()
                .animate({ "marginTop": ($(window).scrollTop()) + -60 + "px" }, "slow");
        });
    }
</script>

This code does not execute at all, the reason i'm using the pageLoad function is because the jquery code failed to execute after updatepanel partial postback. But then after using this one, none of the code above works even on first page startup.

However, the code that USED to work on page load is below but the jquery part STOPPED working after postback:

$(document).ready(function () {
    $().ready(function () {
        var $scrollingDiv = $("#scrollfix");
        $(window).scroll(function () {
            if ($(window).scrollTop() == $(document).height() - $(window).height()) {
                __doPostBack('<%= GetMoreResults.UniqueID %>', '');
            }
            $scrollingDiv
            .stop()
            .animate({ "marginTop": ($(window).scrollTop()) + -60 + "px" }, "slow");
        });
    });
});

Solutions? Thanks alot.

UPDATE #2

This is my current code: It works the first time the page loads, but not after the partial postback trigger by the __doPostBack.

<script type="text/javascript">
        window.load = pageLoad();
            function pageLoad() { 
                var $scrollingDiv = $("#scrollfix"); 
                $(window).scroll(function () { 
                    if ($(window).scrollTop() == $(document).height() - $(window).height()) { 
                        __doPostBack('<%= GetMoreResults.UniqueID %>', ''); 
                    } 
                    $scrollingDiv 
                    .stop() 
                    .animate({ "marginTop": eval($(window).scrollTop()) + -60 + "px" }, "slow"); 
                }); 
            } 
</script>

UPDATE #3

I should mention that this page does not inherit from Page, I've made a custom page class called BasePage : Page.

Maybe pageLoad() does not fire for some reason related to this?

Be more specific, what is not working, can you alert inside .scroll function? — rick schott
– rick schott, Commented Nov 3, 2011 at 17:12
pageLoad() is called automagically if you're using ASP.NET ajax. — jrummell
– jrummell, Commented Nov 3, 2011 at 17:23

rick schott · Accepted Answer · 2011-11-03 17:15:36Z

2

Try using .bind() with your pageLoad:

pageLoad:

It is also called after every partial postback. It basically functions as a combination of Application.Init and PageRequestManager.EndRequest.

   function pageLoad() {
        var $scrollingDiv = $("#scrollfix");
        $(window).bind('scroll', function() {
            if ($(window).scrollTop() == $(document).height() - $(window).height()) {
            __doPostBack('<%= GetMoreResults.UniqueID %>', '');
            }
            $scrollingDiv
            .stop()
            .animate({ "marginTop": ($(window).scrollTop()) + -60 + "px" }, "slow");
        });
    }

$(document).ready() and pageLoad() are not the same!

answered Nov 3, 2011 at 17:15

rick schott

21.1k5 gold badges54 silver badges81 bronze badges

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

3 Comments

user1027620 Over a year ago

Nope I tried the same thing with bind and live, doesn't execute.

user1027620 Over a year ago

Hey Rick, thanks again for the answer, I tried it with pageLoad not with $(document).ready(), that's whats confusing me. It used to work on other projects. I'm gonna try to narrow down the code to check if pageLoad is called each time.

user1027620 Over a year ago

turns out I do have a conflict, using pageLoad() elsewhere.

James Johnson · Accepted Answer · 2011-11-03 17:19:21Z

1

That code won't execute unless you assign it to the window.onload event:

window.onload = pageLoad;

I would also consider wrapping the calculation of the top margin with the eval function:

eval($(window).scrollTop() - 60) + "px"

Lastly, I don't see any need for the second ready state function:

$().ready(function () {

edited Nov 3, 2011 at 17:19

answered Nov 3, 2011 at 17:08

James Johnson

46.1k8 gold badges75 silver badges111 bronze badges

2 Comments

user1027620 Over a year ago

I think the pageLoad() fuction is provided by the ASP.NET ScriptManager and can be used anywhere automatically. But I will try that. Thanks.

jbabey Over a year ago

get rid of the () after pageLoad; you are assigning a function variable to another, not executing a function.

Jacob · Accepted Answer · 2011-11-03 17:16:01Z

0

JavaScript knows nothing about partial page postbacks; that's an ASP.NET wrapper around an AJAX form post that returns HTML content. If you want your pageLoad to be called after partial page postbacks, you'll have to register a client script that calls pageLoad in your postback handler. You'll also need to ensure that the function is called upon your first page load, as @James Johnson pointed out.

answered Nov 3, 2011 at 17:16

Jacob

79k24 gold badges159 silver badges245 bronze badges

Collectives™ on Stack Overflow

jquery, asp.net ajax, javascript not executing at all

UPDATE #2

UPDATE #3

3 Answers 3

3 Comments

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

UPDATE #2

UPDATE #3

3 Answers 3

3 Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related