简体   繁体   English

表单不使用Ajax,直接发布到PHP

[英]Form not using Ajax, posting directly to PHP

I am posting a form to a php file using ajax but for some reason which I can't figure out, it is not using ajax but directly posting to php. 我正在使用ajax将表单发布到php文件,但是由于某种原因,我无法弄清楚,它不是使用ajax,而是直接发布到php。

My form: 我的表格:

  <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>

My jquery: 我的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>')
            });

        }
    });
});

Changes:- 变化:-

Form opening tag is not proper , change like below:- Form opening tag is not proper ,更改如下:-

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

try to change your jquery code first line like below:- 尝试更改您的jquery代码的第一行,如下所示:-

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

Add jquery library also (check that it is added or not?). 还添加jQuery库(检查是否已添加?)。 for example add this code before jQuery code:- 例如,将此代码添加到jQuery代码之前:

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

add $(document).ready(function(){ in your code.like below:- 在您的代码中添加$(document).ready(function(){ ,如下所示:-

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

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM