jquery click() страница освежает сафари?

Question

После публикации данных я не могу видеть сообщение об успешности в браузере Safari, потому что страница обновляется после отправки данных. Другие браузеры показывают сообщение об успешном завершении, которое они не освежают. Пожалуйста, найдите приведенный ниже код и помогите мне разобраться с проблемой?

HTML

<form action="" method="post" id="form-add-vehicleDetails"> 

    <ol style="visibility:hidden;"></ol> 

    <div id="successvehicleadded"></div> 

    <div class="addvehicledetailsform"> 
     <div id="validatevehicledetails"></div> 
<div class="form-group form-group-default required"> 
    <label for="Producer">Producer</label> 
    <input type="text" name="producer" id="producer" class="form-control" maxlength="100" autocomplete = "off" > 
    </div> 
<div class="form-group form-group-default required"> 
     <label for="Model">Model</label> 
     <input type="text" name="model" id="model" class="form-control" maxlength="100" autocomplete = "off" > 
     </div> 

     <div class="form-group form-group-default required"> 
     <label for="Motor">Motor</label> 
     <input type="text" name="motor" id="motor" class="form-control" maxlength="100" autocomplete = "off" > 
     </div> 

     <div class="form-group form-group-default required"> 
      <label for="LicensePlate">License Plate</label> 
      <input type="text" name="licenseplate" id="licenseplate" class="form-control" maxlength="20" autocomplete = "off" > 
      </div> 

      <div class="form-group form-group-default required"> 
      <label for="Freetext">Freetext</label> 
      <textarea class="form-control" rows="9" id="freetext" name="freetext"></textarea> 
      </div> 

      <div class="modal-footer"> 
      <input type="hidden" name="_token" value="{!! csrf_token() !!}"> 
      <button class="btn btn-primary btn-cons m-b-10" type="button" id="addvehicle">Add Vehicle Details</button> 
      </input> 
      </div> 

     </div> 
    </form> 

JS

$(document).ready(function(){ 
$('[data-toggle="modal"]').click(function() { 
var id = $(this).attr('data-id'); 
$("#addvehicle").click(function(e){ 
    e.preventDefault(); 
    var producer  = $('#producer').val(); 
    var model   = $('#model').val(); 
    var motor   = $('#motor').val(); 
    var licenseplate = $('#licenseplate').val(); 
    var freetext  = $('textarea#freetext').val(); 
    var token   = $('input[name=_token]').val(); 
    var addvehicle  = $('#addvehicle').val(); 
    var dataString  = 'producer='+producer+'&model='+model+'&motor='+motor+'&licenseplate='+licenseplate+'&freetext='+freetext+'&token='+token+'&addvehicle='+addvehicle+'&id='+id; 
    $.ajax({ 
     type: "post", 
     url: "{!! URL::to('socialaddvehicle') !!}", 
     data: dataString, 
     success: function(data) { 
      //alert(data); 
      //$('.addvehicledetailsform').fadeOut('slow'); //hiding form 
      var successContent = '<div class="alert alert alert-success" role="alert"><button type="button" class="close" data-dismiss="alert"><span aria-hidden="true">&times;</span></button><strong>Well done!</strong> Vehicle added successfully.</div>'; 
      $('#successvehicleadded').html(successContent); 
     }, 
     error: function(data) { 
      if(data.status === 422) { 
       //process validation errors here. 
       var errors = data.responseJSON; 
       errorsHtml = '<div class="alert alert-danger"><ul>'; 
       $.each(errors , function(key, value) { 
        errorsHtml += '<li>' + value[0] + '</li>'; 
       }); 
       errorsHtml += '</ul></div>'; 
       $('#validatevehicledetails').html(errorsHtml); 
      } 
     } 
    }); 
    return false; 
}); 
}); 
}); 

Answer 1

Удалить атрибут action и добавьте onsubmit="return false;" в форму.

Это должно исправить Opera, пытающуюся отправить форму.

Answer 2

Это должно сделать трюк.

$('#form-add-vehicleDetails').on('submit', function(e){ 
    return false; 
}); 

Это делает две вещи для отправки, уволенные после отправки формы.

1. Отмените событие по умолчанию. e.prventDefault();
2. И прекращает распространение, предотвращая пузырь. e.stopPropagation()

Как объясняет karim79 in his answer.