I have a mobile web page. I am using jQuery Mobile. I have a conditional section of server side code that will produce the following section of code:
<script type="text/javascript"> $(document).ready(function () { var hole = "Hole" + @NextHole; // NextHole is just a server value var divToGoTo = document.getElementById(hole); divToGoTo.scrollIntoView(true); return false; }) </script>
I've also tried this with no luck:
var hole = "#Hole" + @NextHole;
$('html, body').animate({
scrollTop: $(hole).offset().top
}, 0);
return false;
In my development desktop, IE will go to the id set by the var hole and then go to the top of the page. In my iPhone, I can't tell if it goes to the id, but still ends up at the top of the page. I'd like the user to be redirected to the id set by the var hole. I want to stop this behavior of scrolling back to the top on a page loading.
I've tried other ways to do this as well. I've tried to redirect to an anchor tag using a hash on the address. I've tried the .scrollTo jquery library plugin.
It seems to me that jQuery (or jQM) is redirecting me to the top of the page. O've read in other places that I need to have ajaxEnabled = false;. I have this in my mobileinit method. $.mobile.ajaxEnabled = false; Does jQM always redirect a user to the top of the page? Does this sound like something else dumb that I am doing that could be causing this? My client side code is really simple and I am not above blaming myself.
How do I get a page using jQuery Mobile to go to a div tag(or other location) in the iPhone/Android? I have pulled my hair out on this and am hoping that someone can help on this. Thanks for your time.
Wally