在codeigniter中没有文件选择的Ajax表单调用答案

【问题标题】：Ajax form calling without file select in codeigniter在codeigniter中没有文件选择的Ajax表单调用
【发布时间】：2013-08-07 11:24:48
【问题描述】：

我正在使用 CodeIgniter。我正在使用 ajax 表单上传图片。我的主要代码是，

<div id="new_photo">
<?php echo form_open_multipart('upload/upload1','id="my_new"');?>
<input type="file" name="userfile" size="20" />
<input type="submit" value="upload" id="new_photo_upload" name="new_photo_upload" />    
</form>
</div>

我的脚本是，

<script> 
    $(document).ready(function() { 
        $('#my_new').ajaxForm(function() { 
            var baseurl = "<?php echo base_url(); ?>";
                $.ajax({
                   type: "POST",
                   url: baseurl+"upload/new_photo",
                   success: function( r ) {
                     $('#new_photo').html( r );
                   },
                   error: function(){
                        location.reload( true );
                    }
                });
        }); 
    }); 

</script>

这里，如果我上传图片并点击upload，它会通过ajax 上传并正确加载upload/new_photo。

但问题是，如果我点击上传按钮，没有图像选择，它正在加载上传/新照片。我不想要这个。如果我选择任何图像，那么只有它是提交。

帮帮我...

【问题讨论】：

你可以在一个按钮上做一个 jQuery 事件并使用 preventDefault 停止默认操作，检查是否选择了一个文件并适当地继续脚本

标签： php ajax codeigniter upload

【解决方案1】：

给文件输入一个id：

<input type="file" name="userfile" id="userfile" size="20" />

js的变化：

$(document).ready(function() { 
    $('#my_new').ajaxForm(function() { 
        var baseurl = "<?php echo base_url(); ?>";
            $.ajax({
               type: "POST",
               url: baseurl+"upload/new_photo",
               beforeSubmit: function() {
                    if( $("#userfile").val() == "" ){
                        alert( 'Please select a file to upload!' );
                        return false;
                    }
               },
               success: function( r ) {
                 $('#new_photo').html( r );
               },
               error: function(){
                    location.reload( true );
                }
            });
    }); 
});

查找验证输入的beforeSubmit。

【讨论】：