Javascript with Jquery Mobile not working in Android 2.3 and lower

Question

I'm working on an application but it won't give any response on user actions. When you submit the form you just get a empty page. The button Anoniem inloggen don't work either, both are created in javascript. This only happens when using Android 2.3 or lower. I have tried a lot of solutions, but none has worked so far. Even the already given solutions won't work.

Link to the application: http://goo.gl/MsZfO.

The index script of this app looks like this :

<script type="text/javascript">
    $(document).ready(function($) { 
    checkMail();
    $.post('stats.php',
            function (data, textStatus) {
                $('#stats').empty();
                $('#stats').append(data).page();
                $('#stats').page('destroy').page();

            });

            $.post('welcome.php',
            function (data, textStatus) {
                $('#mail').empty();
                $('#mail').append(data).page();
                $('#mail').page('destroy').page();

            });

    function checkMail() {
                    var item = localStorage.getItem('maillogin');
            if (item !== null) {
                window.location = '#stats';
                }
            else{
                window.location = '#mail';
                }
    }
    });
</script> 

The index body:

<div data-role="page" data-theme="a" id="mail" data-transition="none">
</div>
<div data-role="page" data-theme="a" id="stats" data-transition="none">
</div>

And here's the problem page (welcome.php) script:

    $(document).ready(function($) { 
    $('#mailform').submit(function () {
            $.mobile.showPageLoadingMsg();
            var email = document.getElementById('email');
            var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
                if (!filter.test(email.value)) {
                        $.mobile.changePage("#mail");
                        alert('Dit is geen geldig mailadres');
                        $.mobile.hidePageLoadingMsg();
                        return false
                    }
                else{
                if($('#checkbox').attr('checked')) {
            $.post('mailinsert.php',
            $('#mailform').serialize())
                localStorage.setItem('maillogin', $('#email').val());
                $('#inlogmail').empty();
                $('#inlogmail').append(localStorage.getItem('maillogin')).trigger('create');
                $.post('stats.php',
                                         function (data, textStatus) {
                                         $('#stats').empty();
                                         $('#stats').append(data).page();
                                         $('#stats').page('destroy').page();
                                         $.mobile.changePage("#stats");
                                         $.mobile.hidePageLoadingMsg();
                                         });


                }
                else{                       $.mobile.changePage("#mail");
                        alert('De voorwaarden zijn niet geaccepteerd');
                        $.mobile.hidePageLoadingMsg();
                        return false;
                        }

                }
            });
$('#skipright').click(function(){
                localStorage.setItem('maillogin', 'anoniem');
                $.post('stats.php',
                                         function (data, textStatus) {
                                         $('#stats').empty();
                                         $('#stats').append(data).page();
                                         $('#stats').page('destroy').page();
                                         $.mobile.changePage("#stats");
                                         $.mobile.hidePageLoadingMsg();
                                         });

});
});

And the problem page (welcome.php) body:

<form id="mailform">
<div data-role="fieldcontain">
<label for="email">E-mail:</label>
<input name="email" id="email" type="text" />
<br />
<div class="ui-grid-b ui-corner-all ui-shadow ui-bar ui-bar-b">
<input type="checkbox" name="checkbox" id="checkbox" data-role="none"/>
<label for="checkbox">Ja, ik accepteer de voorwaarden</label>
</div></br>
<input type="submit" value="Stemmen maar!"/>
</div>
</form>
<h3><a class="skipright" id="skipright">Anoniem inloggen</a></h3>
</div>

So in short the implemented actions from welcome.php like .click and .submit won't work in index.html on android 2.3 or lower. How can we fix these?

Answer 1

Try with changing your following line:

window.location = '#stats';

for this one:

window.location.href += '#stats';

UPDATE:
If you already have an anchor link loaded in the location (like #home) then do the following:

window.location.href = window.location.href.substr(0, window.location.href.lastIndexOf('#')) + '#stats';