无法使用jquery-validation.js SubmitHandler函数发送“ multipart / form-data”表单数据

时间:2019-09-26 11:39:17

标签: javascript php ajax codeigniter jquery-validate

//这是我的多部分/表单数据表单

<form id="addNewRoomForm" enctype="multipart/form-data">
    <div class="form-group">
        <label for="room_title">Room Title</label>
        <input type="text" class="form-control" id="room_title" name="room_title" placeholder="Enter Room Title">
    </div>
    <div class="form-group">
        <label for="room_category">Room Category</label>
        <select class="form-control" id="room_category" name="room_category">
            <option value=""></option>
            <option value="1">Standard Room</option>
            <option value="2">Family Room</option>
        </select>
    </div>
    <div class="form-group">
        <label for="room-images">Room Images</label>
            <div class="input-images"></div><!--Here im using image-uploader.js Plugin By Christian Bayer-->
    </div>
    <div class="form-group">
        <label for="room_description">Room Description</label>
        <textarea class="form-control" id="room_description" name="room_description" rows="3"></textarea>
    </div>
    <button type="submit" class="btn btn-success btn-icon-split" id="addRoomBtn">
    <span class="icon text-white-50">
        <i class="fas fa-arrow-right"></i>
    </span>
    <span class="text">Add Room</span>
    </button>
</form>

//这是我上面关于表单的ajax表单提交内容,可以正常使用


$("#addNewRoomForm").on('submit', function(e){
  var process_url = "<?php echo base_url();?>";
  e.preventDefault();
  var formData = new FormData(this);

  $.ajax({
      type: 'POST',
      url: process_url + 'admin/rooms/process_add_room',
      data: formData,
      // dataType: 'json',
      contentType: false,
      cache: false,
      processData:false,
      beforeSend: function(){
          alert("sending...");
      },
      success: function(msg){
          alert(msg)
      }
  });
});

//,但是当我在jquery-validation.js的SubmitHandler函数中使用相同的代码时,它在警报函数中显示“ message:Undefined_index:room_title”。以下是显示错误的代码:

$('#addNewRoomForm').validate({ // initialize the plugin
      rules: {
        room_title: {
          required: true,
        },
        room_category: {
          required: true,
        }
      },
      messages: {
        room_title: {
          required: "Please Enter Room Title",          
        },
        room_category: {
          required: "Select Room Category",          
        }
      },
      highlight: function (input) {
        console.log(input);
        $(input).addClass('is-invalid');
      },
      unhighlight: function (input) {
        $(input).removeClass('is-invalid');
      },
      errorPlacement: function (error, element) {
     // $(element).parents('.input-group').append(error);
     $(element).parents('.form-group').append(error);   
   },
   submitHandler: function (form) {

    var process_url = "<?php echo base_url();?>";
      // e.preventDefault();
      var formData = new FormData(this);

      $.ajax({
        type: 'POST',
        url: process_url + 'admin/rooms/process_add_room',
        data: formData,
          // dataType: 'json',
          contentType: false,
          cache: false,
          processData:false,
          beforeSend: function(){
            alert("sending...");
          },
          success: function(msg){
            alert(msg)
          }
        });

      return false;
    }
  });

我想用jquery-validation提交multipart / form-data。我已经尝试了所有方式,希望得到您的帮助。

0 个答案:

没有答案