how to block an action in a form

Asked

Viewed 207 times

0

I have a form and it runs a action, but I have a query to check if there are users in the database. I wanted to know how to block the action when there are users.

Form:

<form onsubmit="return asd()" id="gform" method="POST" data-email="[email protected]"
        action="https://script.google.com/macros/s/AKfycbx4scovKmP5_UnaPUVf3fIBKmyOdCrDFkdIVOdMBji_JUzmltYh/exec" class="contact1-form validate-form">
            <span class="contact1-form-title" style="margin-left: -2%;font-size:4vh">
                    Registe-se e ganhe um brinde
            </span>
            <div class="wrap-input1 validate-input"  data-validate = "Preencha o nome da Empresa">
                <input  style="background:#eeeeee"class="input1" type="text"  id="empresa" name="empresa"  placeholder="Empresa">
                    <span class="shadow-input1"></span>
                </div>
                <div class="wrap-input1 validate-input" data-validate = "O email esta incorrecto">
                        <input style="background:#eeeeee"class="input1" type="email" id="email" name="email"  placeholder="Email">
                        <span class="shadow-input1"></span>
                    </div>


            <div class="wrap-input1 validate-input" data-validate = "Preencha o nome">
                <input style="background:#eeeeee"class="input1" type="text" id="name" name="name"  placeholder="Nome">
                <span class="shadow-input1"></span>
            </div>



            <div class="container-contact1-form-btn"style="width: 100%;margin-top: 2    %;justify-content: left;">
                    <span style=" color:#BDBDBD;padding: 2px;font-size: 2vh;"   class="contact1-form-title">  Eu concordo que o meu contacto seja utilizado exclusivamente pela Wave Solutions para fins de comunicação acerca dos produtos e serviços da Empresa.</span>
                <button  onclick="asd()" type="submit" style="width:100%"  id="btn-submit"class="contact1-form-btn">
                    <span>
                            Reclamar o seu brinde!!
                        <i class="fa fa-long-arrow-right" aria-hidden="true"></i>
                    </span>
                </button>
            </div>



        </form>

Javascript:

 function asd()
 {
    var db = window.openDatabase("demo", "1.0", "demo", 1000*1000);
    console.log(db)

    var empresa = document.getElementById("empresa").value;
    var name = document.getElementById("name").value;
    var email = document.getElementById("email").value;

    db.transaction(function (tx) {
        tx.executeSql('SELECT * FROM DEMO WHERE email=? AND empresa=?', [email, empresa], function(tx, results){
            if (results.rows.length > 0) {

                someBug()
                return false;
             } else {

                tx.executeSql("INSERT INTO DEMO (empresa, name, email) VALUES (?,?,?)", [empresa, name, email], function (tx, result) {
                    console.log(result);
                        $("#gform").submit();
                    }, function (error) {
                    console.log(error);
                });
             }
            console.log(results);
        }, function (error) {
            console.log(error);
        });
    });

 }

1 answer

1


The first step is to change the upload button. Ideally, it should be of the type button, for example: type="button". This will prevent the form from being sent.

<button onclick="asd()" type="button" style="width:100%"  id="btn-submit"class="contact1-form-btn">
    <span>
        Reclamar o seu brinde!!
        <i class="fa fa-long-arrow-right" aria-hidden="true"></i>
    </span>
</button>

Once this is done, we can remove the attribute onsubmit="return asd()" form. As we change the button type, this attribute will become unnecessary.

<form id="gform" method="POST" data-email="[email]" action="https://script.google.com/macros/s/[SEU-CÓDIGO]/exec" class="contact1-form validate-form">

    <!-- Restante permanece igual -->

</form>

Ready! Your Javascript will also remain the same. That’s because you’ve already added $("#gform").submit(); to send the form when everything happens OK

  • Good explanation, however my script when I put button stops working, my doubt is if it is possible to do otherwise

  • @Humbertovieira I edited my code. You even removed the attribute onsubmit form?

  • Yes I did! I can print out what happens if I want!

  • @Humbertovieira can. You even created the query to create the database table?

  • Yes, the query is working, but the problem is that I think I have to call the action when the Insert is done!

  • @Humbertovieira tested with this code and everything is OK. https://hastebin.com/yogirutazi.xml

  • already solved the problem, had a function that was not there in the code to enter in lop, but thank you for the help!

Show 2 more comments

Browser other questions tagged

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