OnSubmit is not working

1

I'm checking a form with onsubmit , but even returning true it's submit. Here is the function that calls onsubmit:

function checkFormModal(){
        var senhaAtual = document.getElementById("senhaAtu").value;
        var alerta = document.getElementById("avisoSenhaDig");
        var usuario = document.getElementById("nomeUsuarioTestaSenha").value;
        var p = document.getElementById("p");
        var xmlreq = CriaRequest();

        xmlreq.open("GET", "../Controller/verificaSenhaUsuario.php?senha="+senhaAtual+"&nomeusu="+usuario, true);

        xmlreq.onreadystatechange = function(){
          if (xmlreq.readyState == 4) {
            if (xmlreq.status == 200) {
              if (xmlreq.responseText == "nao") {
                if (senhaAtual.length > 0) {
                  return false;
                }
                return false;
              }else if (xmlreq.responseText == "sim"){
                p.innerHTML = "true";
                return true;
              }
            }else{
              alerta.innerHTML = "ERRO: " + xmlreq.statusText;
              return false;
            }
          }
        };
        xmlreq.send(null);
        return false;

      }

This is true only if resposeText is yes, it goes into if that checks for it (it gives the innerHTML in p) but even so it does not give the submit in the form. Here's how the OnSubmit is done:

<form name="formSenha" role="form" onsubmit="return checkFormModal()" class="form" action="../Controller/editaSenhaUsuario.php" method="POST" autocomplete="off">

I wonder why it does not give return true. Thank you in advance.

    
asked by anonymous 11.12.2018 / 18:18

2 answers

2

You will not be able to use the form submit with Ajax because both are asynchronous. When you submit, the entire function is executed before Ajax is processed, ie before Ajax is processed, the last return false has already been sent back. Only then does Ajax go into if with true , but then it's late because the function has already returned false .

In this case, you will have to do a manual submit after processing Ajax. You need to send the form via this to onsubmit this way:

onsubmit="return checkFormModal(this)"

And include a parameter in the function:

function checkFormModal(form){...

The variable form will be the element of the form within the function. In my view, all those if's checking nao and multiple false returns become unnecessary, leaving only the last return false so that the form is not submitted by calling the function.

Reformulating the function, it would look like this, doing a submit when the Ajax return is sim :

function checkFormModal(form){

        var senhaAtual = document.getElementById("senhaAtu").value;
        var alerta = document.getElementById("avisoSenhaDig");
        var usuario = document.getElementById("nomeUsuarioTestaSenha").value;
        var p = document.getElementById("p");
        var xmlreq = new XMLHttpRequest();
        var xmlreq = CriaRequest();

        xmlreq.open("GET", "../Controller/verificaSenhaUsuario.php?senha="+senhaAtual+"&nomeusu="+usuario, true);

        xmlreq.onreadystatechange = function(){
          if (xmlreq.readyState == 4) {
            if (xmlreq.status == 200) {
              if (xmlreq.responseText == "sim"){
                p.innerHTML = "true";
                form.submit();
              }
            }else{
              alerta.innerHTML = "ERRO: " + xmlreq.statusText;
            }
          }
        };
        xmlreq.send(null);

        return false;
}
    
11.12.2018 / 19:56
0

If I understand what you want to do, what you need is for your checkFormModal() method to return true or false , and in case false the page is not sent.

If that's what you need to do it's something like this here.

<form action="/*pagina*/" onsubmit="return checkFormModal(this)" method="post">

 /***Seus inputs***/
<input type="submit" value="Submit">

</form>
    
11.12.2018 / 18:30