Javascript blocking required

Question

Javascript blocking required

Navigation

#1 by (1 votes)

0

I have a strange problem. I added the function below to prevent the user from clicking more than once on the submit. But from the moment I added it, HTML5 required and validate () stopped working in all fields. Could anyone tell me the reason?

function block() {
        var button = document.getElementById("confirmar");
        button.removeAttribute("disabled");
        button.onclick = function() {
          if (!button.getAttribute("disabled") != "disabled") {
            button.setAttribute("disabled", "disabled");
            setTimeout(function() {
              button.removeAttribute("disabled");
            }, 5000);
            document.getElementById("cadastro").submit();
          }
        }
}

<body class="noheader" onload="moveRelogio(); getInfo(); document.cadastro.reset(); slide(); block()">

javascript html5

asked by anonymous 28.01.2016 / 13:49

1 answer

How to make a post using Retrofit Giving error when validating the data coming from the form [duplicated]

score 1 · Accepted Answer

In short, disabled can take a lot of functionality from your page. For more information, search the internet. The correct thing is you add in your .js file that your mastepage or _Layout renders, the function:

$(document).on({
submit: function () { $(this).find('[type="submit"]:not([ajax="true"])').prop('disabled', true); },
ready: function () { $(this).find('[type="submit"]').prop('disabled', false); }

});

In this case, all your pages that have the submit, will be blocked after the click.

Note that not ([ajax="true"]) is not to execute this procedure when your button has ajax = true, for example:

<button type="submit" class="btn btn-success btn-sm" id="btnSalvar" name="btnSalvar" value="Salvar" ajax="true">Salvar</button>

And to lock the button after the click, just take the ajax

The submit will block and the ready will unlock.

I hope I have helped.