未定义的索引,发生了什么?

时间:2017-12-14 13:02:47

标签: javascript php jquery forms

我使用jquery表单js上传实时图像。下面是我的代码。

HTML

<form id="imageform" name="imageform" method="POST" enctype="multipart/form-data" action="ajax/ajax_quotation_imageUpload.php"  >
  <div class="form-group col-md-12" style="margin-bottom: 0px;">
    <label>Select Image File :</label>
    <input type="file" class="form-control qimage" name="qimage">
  </div>
  <img src="images/loader2.gif" id="loader" style="display: none;">
  <div class="clearfix"></div>
</form>

脚本

$('.qimage').on('change', function(){ 
  $('#loader').show();
  $(".qimage").attr("disabled", "true");
  $("#imageform").ajaxForm({ 
    success:   function(data) {
      alert(data);
    } 
  }).submit();    
});

PHP PAGE

$filename = stripslashes($_FILES['qimage']['name']);
echo $filename;

这是我的完整代码。每当我上传文件它返回未定义的qimage。我在哪里得到错误的代码?

2 个答案:

答案 0 :(得分:1)

在提交表单数据$(".qimage").attr("disabled", "true");之前禁用文件输入元素,因此不会提交其数据。

提交详细信息后禁用它。

答案 1 :(得分:-2)

在HTML5之前,有一堆技术和插件可供jQuery实现AJAX文件上传。 HTML5引入了可以简化文件上传的FormData类。 要构造包含现有数据的FormData对象,请在创建FormData对象时指定该表单元素:

var formData = new FormData(someFormElement);

有关FormData()的更多信息,请参阅文档https://developer.mozilla.org/en-US/docs/Web/API/FormData/Using_FormData_Objects

HTML

<form id="imageform" name="imageform" method="POST" enctype="multipart/form-data">
  <div class="form-group col-md-12" style="margin-bottom: 0px;">
    <label>Select Image File :</label>
    <input type="file" class="form-control qimage" name="qimage">
  </div>
  <img src="images/loader2.gif" id="loader" style="display: none;">
  <div class="clearfix"></div>
</form>

的jQuery

<script>
    $(document).ready(function(e) {
        $('.qimage').change(function() {
            if (window.FormData){
               var formdata = new FormData($('#imageform'));
            }else{
               var formData = $('#imageform').serialize();
            }

            $.ajax({
                type: 'POST',
                url: 'ajax/ajax_quotation_imageUpload.php',
                data: formData,
                cache: 'false',
                success: function(res) {
                    alert(res);
                }
            });
            return false;
        });
    });
</script>

PHP代码

<?php
$filename = stripslashes($_FILES['qimage']['name']);
echo $filename;
?>