Javascript x Ajax x html x jquery

Asked

Viewed 196 times

1

Please, I need some help. I’m trying to develop an app with phonegap x html x jquery x javascript and Ajax, I have the following situation:

I am on a page, after the user login with email and password, call the ajax, from an external page to validate, on js. As below:

Item 1:

$('form').submit(function() {    
console.log( "submit!" );
var postData = $(this).serialize();
$.ajax({
        type: 'POST',
        data: postData,
        url: 'http://localhost/service/service_usu.php',
        success: function(data){
            //alert('ret:'+data);
                if (data!='11') {
                    //alert('usuario nao validado!');                               
                    window.location='http://localhost/usu_incons.html';
                }           
                if (data=='11') {
                    alert('usuario validado!');
                    //window.location='http://localhost/inc_usu_ok.html';
                }           
        },
        error: function(){
            //console.log(data);
            alert('There was an error adding your comment');
        }
    });
    return false;
});

Perfect, performs user check and when negative calls the page usu_incons.html, and on this page shows the reason for the inconsistency and has a back button: <a id="voltar" href="index.html" data-role="button">Usu&aacute;rio ou email inexistente!</a>

Perfect, it goes back to the page index.html. On this page index.html the button of javascript of item 1 above no longer works, already tried the item 3 below and nothing....... I do not know what to do so that I can inform again the email and password and call the js/ajax again.

item 3:

$(document).ready(function(){
  app.initalize;
  app.receivedEvent;
  console.log( "ready!" );
});
var app = {

        initialize: function() {
            this.bindEvents();
            //console.log( "entrou initialize" );
        },

        bindEvents: function() {
            document.addEventListener('deviceready', this.onDeviceReady, false);
            $(document).on("pagecontainershow", app.onDeviceReady);
        },

        onDeviceReady: function() {
            app.receivedEvent('deviceready')
        },

        receivedEvent: function(id){

            alert($.mobile.pageContainer.pagecontainer('getActivePage').data('http://localhost/usu_incons.html'));

        }

}
javascript ajax apache-cordova

  • Where’s the button action?

  • Using the Submit button with ajax can cause many problems. Usually when I use ajax I change the Submit button by the input type button. I imagine your form does not have an action, since you are using ajax. So the form may be reloading the page without you noticing.

1 answer

1

Try the following

Include a touch/click action on the Ubmit button, perform this at the time of "deviceready"

//exemplo
jQuery("#id_do_submit").on("click",function(e){
    e.preventDefault(); //para evitar que execute algo...
    //seu código aqui
});

With this you ensure that every time the button is clicked an action will be executed.

Of course you need to take care not to run several times in case a user presses the button several times...

^^V

Browser other questions tagged javascript ajax apache-cordova

You are not signed in. Login or sign up in order to post.