2012-01-23 23 views
0

我正在使用codeigniter和jquery。我在我的view脚本中有一个上传表单。上传表单由几个文本输入和一个文件输入组成。当有人点击它的菜单链接时,表单会弹出(我用Jquery Modal表单完成)。是否有任何可能的方式来模拟表单提交时的ajax调用?所以当用户点击提交时,文件将被发送到服务器上的一个目录,因此信息将被存储在数据库中。是否可以通过iframe上传文件以及多个数据?

这里是我的代码: THE VIEW:

<div id="right_column" class="grid_7 omega"> 
     <section id="music_features"> 
      <header> 
       <hgroup> 
        <h1>Your Playlist</h1> 
        <p>Up to only 3 files allowed for beta version</p> 
       </hgroup> 
      </header> 
      <p id="song_upload_menu"><?php echo anchor('#', 'Upload Song');?></p> 
      <article id="song_upload_form"> 
       <div id="song_upload_info"> 
        <?php echo $this->session->flashdata('info'); ?> 
       </div> 
       <?php echo form_open_multipart('profile/do_upload_song');?> 
       <input type="hidden" id="user_id" name="user_id" value="<?php echo $user->id_str;?>" /> 
       <label for="title">Song Title</label> 
       <input type="text" name="title" id="title" size="30" value="<?php echo set_value('title'); ?>"/><br /> 
       <label for="album"> Album Title </label> 
       <input type="text" name="album" id="album" size="30" value="<?php echo set_value('album'); ?>"/><br /> 
       <label for="artist">Artist</label> 
       <input type="text" name="artist" id="artist" size="20" value="<?php echo set_value('artist'); ?>"/><br /> 
       <input type="file" name="userfile" size="20" /><br /> 
       <input type="radio" name="license" id="license" value="owner"/>I AM the artist/owner of this song and I have the right for distribution<br /> 
       <input type="radio" name="license" id="license" value="not owner"/>I AM NOT the artist/owner of this song BUT I have the right for distribution</br> 
       <input type="checkbox" name="song_license_agreement"/>By selecting this option, I swear that all information entered is right<br /> 
       <input type="submit" id="song_upload_submit" value="Upload Your Song"/> 
       </form> 
      </article> 
      <ul id="playlist"> 
       <!-- your song goes here --> 
      </ul> 
     </section> 

这是我的一个功能来处理TE上传:

function do_upload_song() 
    { 
     //$file_element_name = 'users_song'; 

     $config['upload_path'] = './media/'; 
     $config['allowed_types'] = 'mp3'; 
     $config['max_size'] = '30720'; 
     $config['encrypt_name'] = TRUE; 

     $this->load->library('upload', $config); 
     //set validation rules 
     $this->form_validation->set_rules('title', 'Song title', 'trim|required|xss_clean'); 
     $this->form_validation->set_rules('album', 'Album', 'trim|required|xss_clean'); 
     $this->form_validation->set_rules('artist', 'Artist', 'required|xss_clean'); 
     $this->form_validation->set_rules('license', 'License', 'required'); 
     $this->form_validation->set_rules('song_license_agreement', 'License Agreement', 'required'); 

     if ($this->form_validation->run() == FALSE) 
     { 
      $this->session->set_flashdata('info', validation_errors()); 
      redirect('profile'); 
     } 
     else 
     { 
      if (! $this->upload->do_upload()) 
      { 
       $this->session->set_flashdata('info', $this->upload->display_errors()); 
       redirect('profile'); 
      } 
      else 
      { 
       $data = $this->upload->data(); 
       $add_song = $this->media_model->add_song($data['file_name']); 
       if($add_song) 
       { 
        $this->session->set_flashdata('info', 'Your song has been uploaded'); 
        redirect('profile'); 
       } 
       else 
       { 
        unlink($data['full_path']); 
        $this->session->set_flashdata('info', 'Song upload fail'); 
        redirect('profile'); 
       } 

      } 
      @unlink($_FILES); 
     } 

    } 

,这是我的.js

$(document).ready(function(){ 
$('#song_upload_form').hide(); 
    $('#song_upload_menu').click(function(e){        
     $('#song_upload_form').dialog({ 
         title: 'Upload the cool track man!', 
         width: 520, 
         show: 'fade', 
         hide: 'fade', 
         modal: true 
         });      
     e.preventDefault(); 
    }); 
}); 

JS脚本使模态窗体弹出,但我不知道该怎么做。我只能通过ajax发送数据。但文件是不同的。我知道他们不能通过Ajax发送。我在网上发现的许多文章告诉我关于Iframe的问题,但他们只处理文件。我无法找到一个切实可行的解决方案来解决我的问题,即模拟ajax同时发送数据和文件。任何建议家伙?谢谢

回答

2

我刚刚读到这个自己。看看这里:http://joekuan.wordpress.com/2009/06/12/ajax-a-simplified-version-of-file-upload-form-using-iframe/

它说你可以重定向表单上传到隐藏的iframe。很酷。我还没有尝试过,但你应该能够在网上找到关于它的各种信息。

+0

如果我有几个输入类型,如文本或单选按钮(就像上面的代码),它仍然可以使用IFrame。我试过最后一次,但它似乎不起作用。或者我只是错过了一些东西。我会尝试你给我的教程。我会让你知道:-) – under5hell

+0

我相信它应该仍然有效。这是接下来我要做的事情,但我不愿意开始:) – mowwwalker

+0

@ under5hell,我做了一些测试,并且没有为我工作的是,我没有设置enctype按照PHP文档的规定:'enctype =“multipart/form-data”'http://us.php.net/manual/en/features.file-upload.post-method.php – mowwwalker

相关问题