CODEWITHSUNDEEP
javascriptcssajaxjquery-mobile
Copland14
Copland14

Reputation: 21

Loading AJAX on jQuery Mobile

I'm currently creating a jQuery Mobile app. However I am testing the page through Firefox simply because I would have to keep reinstalling the app if I was to do it on the iPad.

Here is where I am stuck, when I added the AJAX into my page it worked fine. I have added the AJAX for the login. However when I click login, it indeed does check the user/pass against the database and comes back with an error I have wrote if it is wrong which is fine.

When I login it should redirect me to the first page (page1.html), it does take me to the page but it doesn't load the JQM CSS which is quite a big problem. This is because it is an app therefore it is purely CSS'd through the standard JQM theme.

Here is my AJAX can anyone tell me why is isn't bringing back my CSS but just the page content (text/pics etc)?

function doLogin()
  {

    var userName = document.forms['validateform'].elements['user-name'].value;
    var passWord = document.forms['validateform'].elements['password'].value;
    var request = 'checkLogin';

    $.ajax ({

                url:'http://127.0.0.1/hrdatabase/appLogin.php',
                cache:false,
                data: {'request': request,  'user-name': userName, 'password': passWord},
                dataType: 'json',
                async: false,
                success: function(data)
                {
                    $('#errMsg').html(data.errMsg);
                    if (jQuery.trim(data.errMsg).length ==0)
                    {
                        document.location.href='page1.html';
                    }
                    else
                      {
                        alert (data.errMsg);
                      }
                }

            });
  }

Upvotes: 0

Views: 88

Answers (1)

Copland14
Copland14

Reputation: 21

Since posting this I have actually sussed it out. Basically the:

$('#errMsg').html(data.errMsg);
                if (jQuery.trim(data.errMsg).length ==0)
                {
                    document.location.href='page1.html';
                }

This code should be:

$('#errMsg').html(data.errMsg);
                if (jQuery.trim(data.errMsg).length ==0)
                {
                    $.mobile.changePage ("page1.html");
                }

Thanks to anyone anyway. Will leave this up incase anyone finds it useful.

Upvotes: 1

Related Questions