使用Codeigniter和jQuery Form Plugin上傳Ajax文件

我試圖在Codeigniter中使用jQuery Form Plugin。當我嘗試上傳時，頁面被重定向（所以ajax不起作用）並且沒有任何內容被上傳。使用Codeigniter和jQuery Form Plugin上傳Ajax文件

從哪裏形式所處的看法是這樣的：

<form id="upload_form" action="upload/do_upload" method="post" enctype="multipart/form-data"> 
    <input type="file" name="myfile"><br> 
    <input type="submit" value="Upload File to Server"> 
</form> 

<div class="progress"> 
     <div class="bar"></div > 
     <div class="percent">0%</div > 
</div> 
<div id="status"></div> 

<script> 
(function() { 

var bar = $('.bar'); 
var percent = $('.percent'); 
var status = $('#status'); 

$('#upload_form').ajaxForm({ 
    beforeSend: function() { 
     status.empty(); 
     var percentVal = '0%'; 
     bar.width(percentVal) 
     percent.html(percentVal); 
    }, 
    uploadProgress: function(event, position, total, percentComplete) { 
     var percentVal = percentComplete + '%'; 
     bar.width(percentVal) 
     percent.html(percentVal); 
    }, 
    complete: function(xhr) { 
    status.html(xhr.responseText); 
    } 
}); 

})(); 
</script>  
<script type="text/javascript" src="http://localhost/editor/assets/js/jquery-1.7.2.min.js"></script> 
<script type="text/javascript" src="http://localhost/editor/assets/js/jquery.form.js"></script> 
</body>

而對於上傳控制器剛剛從笨手動拍攝：

<?php 

class Upload extends CI_Controller { 

    function __construct() 
    { 
     parent::__construct(); 
     $this->load->helper(array('form', 'url')); 
    } 

    function do_upload() 
    { 
     $config['upload_path'] = './userdata/'; 
     $config['allowed_types'] = 'gif|jpg|png'; 
     $config['max_size'] = '100'; 
     $config['max_width'] = '1024'; 
     $config['max_height'] = '768'; 

     $this->load->library('upload', $config); 

     if (! $this->upload->do_upload()) 
     { 
      $error = array('error' => $this->upload->display_errors()); 

      //$this->load->view('upload_form', $error); TODO echo error 
     } 
     else 
     { 
      $data = array('upload_data' => $this->upload->data()); 

      //$this->load->view('upload_success', $data); TODO echo succes 
     } 
    } 
} 
?>

我敢肯定，我」我剛剛在某個地方犯了一個小錯誤，是否有人能看到我出錯的地方？提前致謝！

來源

2013-03-15 Jamie Fearon

看起來您忘了在DOM準備就緒時初始化表單。

$(document).ready(function() { 
     // bind 'myForm' and provide a simple callback function 
     $('#upload_form').ajaxForm(function() { 
      //rest of your code from the post 
     }); 
    });

來源

2013-03-17 04:47:25 ekims

使用Codeigniter和jQuery Form Plugin上傳Ajax文件

回答

相關問題