表單不使用Ajax，直接發布到PHP

Question

我正在使用ajax將表單發布到php文件，但是由於某種原因，我無法弄清楚，它不是使用ajax，而是直接發布到php。

我的表格：

  <form id="editform" name="editform" action="ajaxeditform.php" method="post">
      <input type="hidden" name="aid" id="aid" readonly class="form-control col-md-7 col-xs-12"/>
      <input type="text" name="number" id="tailnumber" readonly class="form-control col-md-7 col-xs-12"/>
      <input type="text" name="type" id="type" class="form-control col-md-7 col-xs-12" placeholder="e.g. C172" />
      <input type="text" name="colormarkings" id="colormarkings" class="form-control col-md-7 col-xs-12" />
      <button type="submit" class="btn btn-success">Update info</button></div>
  </form>

我的jQuery：

 $('#editform').on('submit', function(e){
    e.preventDefault();

    $.ajax({
        type: $(this).attr('method'),
        url: $(this).attr('action'),
        data: $(this).serialize(),
        dataType: 'json',
        cache: false,
    })
    .success(function(response) {
        // remove all errors
        $('input').removeClass('error').next('.errormessage').html('');

        if(!response.errors && response.result) {

                new PNotify({
                            title: 'Success',
                            text: 'Info updated successfully',
                            type: 'success'
                        });

        } else {

            $.each(response.errors, function( index, value) {
                // add error classes
                $('input[name*='+index+']').addClass('error').after('<div class="errormessage">'+value+'</div>')
            });

        }
    });
});

Answer 1

變化：-

Form opening tag is not proper ，更改如下：-

<form id="editform" name="editform" action="ajaxeditform.php" method="post">

嘗試更改您的jquery代碼的第一行，如下所示：-

$('Form#editform').on('submit', function(e){或$('.btn-success').click(function(e){

還添加jQuery庫（檢查是否已添加？）。 例如，將此代碼添加到jQuery代碼之前：

<script src="//code.jquery.com/jquery-1.12.0.min.js"></script>

在您的代碼中添加$(document).ready(function(){ ，如下所示：-

$(document).ready(function(e){
  ........ //your code
});