PHP文件上传无法在jquery ajax表单中使用

时间:2013-07-23 16:52:42

标签: php javascript jquery ajax codeigniter

我正在使用ajax表单动态显示表单,其中包含文件上载选项。我得到每个文本值的post值,但File数组为空。 我已执行print_r($_POST)print_r($_FILES)查看帖子数据,$ _FILES数组显示空值。

这是我正在使用的表格。

<form class="form-3 form-horizontal ajxfrm" id="step-three" enctype="multipart/form-data" action="<?php echo $html->addLink(array('controller'=>'homes','action'=>'step_three_ajax')); ?>" method="post">
<div id="calendar">
    <div class="clear"></div>
    <div style="position:relative">
        <div class="control-group">
            <div class="control-label"><label class="control-label">Name</label></div>
            <div class="controls"><input id="name" type="text" name="name" /></div>
        </div>
    </div>
    <div style="position:relative">
        <div class="control-group">
            <div class="control-label">Email</div>
            <div class="controls"><input id="email" type="text" name="email" /></div>
        </div>
    </div>
    <div style="position:relative">
        <div class="control-group">
            <div class="control-label">Contact</div>
            <div class="controls"><input id="contact" type="text" name="contact" /></div>
        </div>
    </div>
    <div style="position:relative">
        <div class="control-group">
            <div class="control-label">Files<br/><span style="font-size:10px; font-style:italic">(Optional)</span></div>
            <div class="controls">
                <input id="fileupload" type="file" name="fileupload" /><br/>
            </div>
        </div>
    </div>
    <div style="position:relative">
        <div class="control-group">
            <div class="control-label">Your Message</div>
            <div class="controls"><textarea id="message" rows="3" name="message"></textarea></div>
        </div>
    </div>
    <div class="clear"></div>
</div>
<div id="submit">       
    <input type="hidden" name="post" value="1"/>
    <input type="submit" class="btn green" value="Next"/> 
</div>
</form>

这是ajax调用

$('.ajxfrm').live('submit',function(){
    var thisObj = this;
    var submit = true;
    if('step-two'==$(thisObj).attr('id')){
        submit = stepTwo();
    }else if('step-three'==$(thisObj).attr('id')){
        submit = stepThree();
    }           
    if(submit){
        $.ajax({
            type: "POST",
            data: $(thisObj).serialize(),
            url: $(thisObj).attr('action'),
            beforeSend: function(){
                showOverLayer();
            },
            success: function(data){
                $(thisObj).parent("#content").empty().html(data).hide().fadeIn(function(){
                    setBlocks();
                    setLiClick();
                    hideOverLayer();
                });
                changeCalNaviHref();
            }
        });
    }
    return false;
});

这里我使用$ booker-&gt; uploadfiles()调用上传功能;在控制器中 这是控制器方法功能

public function step_three(){
    //save booking
    if(isset($_POST['post'])){
        $booker = new Booker();     
        //create booker
        $_SESSION['userdat']['name']=$_POST['name'];
        $_SESSION['userdat']['email']=$_POST['email'];
        $_SESSION['userdat']['contact']=$_POST['contact'];
        $_SESSION['userdat']['message']=$_POST['message'];

        if($booker->setsessions($_SESSION['userdat']))
        {
            $booker->uploadfiles();
            $this->redirect(array('controller'=>'homes','action'=>'step_four'));
        }
        else
        {
            $this->setFlashMsg('Please Provide Valid Information','message-box ok');
        }
    }
}

这是模型函数uploadfiles()

public function uploadfiles()
    {
    if(isset($_FILES['fileupload']))
    {
        $errors= array();
        foreach($_FILES['fileupload']['tmp_name'] as $key => $tmp_name )
        {
            print_r($_FILES);
            exit;
            $file_name = $key.$_FILES['fileupload']['name'][$key];
            $file_size =$_FILES['fileupload']['size'][$key];
            $file_tmp =$_FILES['fileupload']['tmp_name'][$key];
            $file_type=$_FILES['fileupload']['type'][$key]; 
            if($file_size > 2097152)
            {
                $errors[]='File size must be less than 2 MB';
            }   
            $upload_dir = ROOT;
            $desired_dir="/uploads/";
            if(empty($errors)==true)
            {
                if(is_dir($desired_dir)==false)
                {
                    mkdir("$desired_dir", 0700); // Create directory if it does not exist
                }
            if(is_dir("$desired_dir/".$file_name)==false)
            {
                //$file_path=$upload_dir."$desired_dir/".$file_name;
                move_uploaded_file($file_tmp,$upload_dir."$desired_dir/".$file_name);
            }
            else
            {                                           // rename the file if another one exist
                $file_path=$upload_dir."$desired_dir/".$file_name.time();
                rename($file_tmp,$file_path) ;              
            }           
        }
        else
        {
            print_r($errors);
        }
    }
    if(empty($error))
    {
            //echo "Success"; exit;
            return true;
    }
    return false;
}

我在这里缺少什么?

3 个答案:

答案 0 :(得分:1)

试试这个。

$('.ajxfrm').live('submit',function(){
        var thisObj = $(this),
            submit = true;

        if('step-two'== thisObj.attr('id')){
            submit = stepTwo();
        }else if('step-three'== thisObj.attr('id')){
            submit = stepThree();
        }
        if(submit){
            $.ajax({
              type: "POST",
              data: thisObj.serialize(),
              url: thisObj.attr('action'),
              beforeSend: function(){
                 showOverLayer();
              },
              success: function(data){
                 thisObj.parent("#content").empty().html(data).hide().fadeIn(function(){
                     setBlocks();
                     setLiClick();
                     hideOverLayer();
                 });
                 changeCalNaviHref();
              }
            });
        }
    return false;
});

你能告诉我一个关于成功方法的console.log(数据)吗?

由于

答案 1 :(得分:0)

这里有两个远射:

1)您提到您的会话代码是“顶部”。你在那里使用session_regenerate_id这样的东西吗?这会使并行上传变得混乱。

2)看看当其他会话进入时你的会话文件是否被锁定。在session_write_close()上搜索一两篇文章。

但它更有可能成为#1。

答案 2 :(得分:0)

您无法使用'旧'AJAX(不是这种方式)发送文件。

如果要发送文件,请查看XMLHttpRequest2。非常好的教程在这里 - http://www.html5rocks.com/en/tutorials/file/xhr2/