function CheckExist(e) { var phone = $('#phone').val(); event.preventDefault(); $.post('/ajax/CheckExistCustomer', {phone:phone}, function(data){ if(data) { alert(12); } }); }

So event.preventDefault (); works and if

  function CheckExist(e) { var phone = $('#phone').val(); $.post('/ajax/CheckExistCustomer', {phone:phone}, function(data){ if(data) { event.preventDefault(); } }); }

then the form works anyway. What am I doing wrong?

  <form id="NewCustomerForm" class="smart-form"> <fieldset> <section class="col col-4"> <label class="input"> <input type="text" name="name" id="name" placeholder="Имя клиента"> </label> </section> <section class="col col-4"> <label class="input"> <input type="text" name="phone" id="phone" placeholder="Телефон"> </label> </section> </fieldset> <footer> <a href="/admin/customers/" class="btn btn-success noradius marbot25"> Отмена </a> <input type="submit" name="AddCustomer1" class="btn btn-info noradius" formaction="" formmethod="POST" value="Сохранить" onclick="CheckExist(this)"> </footer> </form>

    1 answer 1

    First, do not write

     event.preventDefault();

    but

     e.preventDefault();

    using the parameter of the CheckExist function, which I suppose is an event.

    The second. Call e.preventDefault(); inside the $.post handler does not make sense, since it will happen much later, by that time the CheckExist function CheckExist have finished its work long ago - the $.post is a method that works asynchronously.

    Try to explain what you want to do, and you will be prompted to make a decision.

    Update

    In this case, you should always call e.preventDefault(); at the beginning of the function:

     $(document).ready(function() { $("#NewCustomerForm").submit(CheckExist); function CheckExist(e) { e.preventDefault(); var phone = $('#phone').val(); $.post('/ajax/CheckExistCustomer', {phone:phone}, function(data){ if(data.alreadyExists) { alert("Phone already exists in the database."); } else { $("#NewCustomerForm")[0].submit(); } }); } });

    Update 2

    $("#NewCustomerForm") and remove onclick="CheckExist(this)" from html.

    • There is a click on submit. Pressing the button takes input. Whether there is a value in the database is checked, and if there is, then the form is not submitted. and the message that this already exists in the database. - Durrasell
    • $ ("NewCustomerForm"). Submit (CheckExist); function CheckExist (e) {e.preventDefault (); var phone = $ ('# phone'). val (); $ .post ('/ ajax / CheckExistCustomer', {phone: phone}, function (data) {if (data) {alert ("Phone already exists in the database.");} else {$ ("NewCustomerForm") [ 0] .submit ();}}); } always goes - Durrasell
    • not $("NewCustomerForm") , a $("#NewCustomerForm") - Igor
    • changed to form now when clicking gives an error CheckExist is not defined (...) - Durrasell
    • @Durrasell Give the full code (and relevant html) - add it to the question, otherwise it’s hard to see through your monitor what you are doing there :). - Igor