如何使用jQuery AJAX集成Codeigniter表单验证库和文件上传?

时间:2014-04-29 10:59:50

标签: javascript php jquery ajax codeigniter

这是我的控制器文件

下面的代码只能处理上传到路径中的文件,当我提供输入时,数据库中没有数据显示。另一个疑问,当我提交空输入时,它没有显示验证错误。

var $default_news_status = 1;
var $default_client_status = 1;
var $default_client_partner_flag = 0;
var $default_client_logo_display_flag = 1;
var $default_client_test_status = 0;
public function construct()
{     
    parent::__construct();

    $this->load->helper(array('form', 'url', 'file'));
}

/*controlles vadmin/addnews*/
public function addnews()
{
//$status = "";
//$msg = "";
$userfile = 'userfile';


    //echo '<br>entered into ajax if block.. ';

    /******* extracting file extension ********/
    $org_filename = $_FILES['userfile']['name'];
    $path_parts = pathinfo($org_filename);
    //$file_extension = $path_parts['extension'];
    /***** end extracting file extension ******/
    $this->load->library('form_validation');

    $this->form_validation->set_rules('title', 'Title', 'trim|required|min_length[5]');
    $this->form_validation->set_rules('description', 'Description', 'trim|required');
    $this->form_validation->set_rules('url', 'URL', 'trim|required');
    $this->form_validation->set_rules('userfile', 'Image', 'trim');
    $this->form_validation->set_rules('postedon', 'Posted On', 'trim|required');
    $this->form_validation->set_rules('source', 'Source','trim|required|min_length[5]|max_length[12]');
    $this->form_validation->set_rules('expiredate', 'Expire Date', 'trim|required');

    if($this->form_validation->run() == FALSE)
    { 
        echo json_encode(array('status'=>0, 'msg' => validation_errors()));
    }   
    $config['upload_path'] = './uploads/';
    $config['allowed_types'] = 'gif|jpg|png';
    $config['max_size'] = 1024 * 1000;       
    //$config['file_name'] = 'client_'.time().'.'.$file_extension;

    //echo "<pre>";
   //print_r($_FILES);

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

    if (!$this->upload->do_upload($userfile))
    {
       echo '<br>entered into upload failed block.. ';
       $error = array('error' => $this->upload->display_errors());
       echo json_encode($error);
    }
    else
    {
        echo '<br>entered into upload success block.. ';

        /*$data = $this->upload->data();
        echo "<pre>";
        print_r($data);*/

        /**** assignment of post data ******/
        $title = $this->input->post('title');
        $description = $this->input->post('description');
        $url = $this->input->post('url');
        $userfile = $this->input->post('userfile');
        $postedon = $this->input->post('postedon');     
        $source = $this->input->post('source');
        $expiredate = $this->input->post('expiredate');
        $status = $this->default_news_status ;
        /**** end assignment of post data ******/

        /**** load news model to insert reocrd into table *****/
        $this->load->model('vadmin/Newsmodel','',true);
        $this->Newsmodel->addRequestForm();
        /**** load news model to insert reocrd into table *****/

        //print jsone response for ajax request
        echo json_encode(array('status'=>0, 'msg' => 'Successfully Submitted'));

     }


}

这是我的观点表格 和js文件在下面给出

<form method="post" action="" name="newsform" id="newsform" enctype= "multipart/form-data" >
                 <input type="hidden" value="" id="id" name="id" required="true"> 
                <table width="580" cellpadding="5" cellspacing="5">

                <tr>
                        <td width="130" align="left"><span class="required">*</span>Title</td>
                        <td align="left"><input name="title" type="text" id="title" style="width:250px;" value="<?php echo $news_title; ?>"/></td>
                    </tr>
                    <tr>
                        <td width="130" align="left"><span class="required">*</span>Description</td>
                        <td align="left"><textarea name="description"  rows="8" cols="40"  id="description" style="width:250px;" ><?php echo $news_description; ?></textarea></td>
                    </tr>
                    <tr>
                        <td width="130" align="left"><span class="required">*</span>URL</td>
                        <td align="left"><input name="url" type="text" id="url" style="width:250px;" value="<?php echo $news_url; ?>" /></td>
                    </tr>
                    <tr>
                        <td width="130" align="left"><span class="required">*</span>Image</td>

                        <td align="left"><input name="userfile" type="file" id="userfile" style="width:250px;" value="<?php echo $news_image; ?>" /></td>
                        <tr>
                        <td width="130" align="left"><span class="required">*</span>Posted On</td>
                        <td align="left"><input name="postedon"  id="datepicker" style="width:250px;" value="<?php echo $news_posted_on; ?>" /></td> 

                    </tr>
                    <tr>
                        <td width="130" align="left"><span class="required">*</span>Source</td>
                        <td align="left"><input name="source" type="text" id="source" style="width:250px;" value="<?php echo $news_source; ?>" /></td>
                    </tr>
                    <tr>
                        <td width="130" align="left"><span class="required">*</span>Expire Date</td>
                        <td align="left"><input name="expiredate"  id="datepicker1" style="width:250px;" value="<?php echo $news_expire_date; ?>"/></td>
                    </tr>
                       <td colspan="2" align="left"><input type="submit" value="Submit" id="submit" onclick="return ajaxFileUpload();" />
                       <input type="reset" value ="reset" id="reset" /><span id="loading" >Please wait ..</span></td>
                    </tr>
                </table>

                <input type="hidden" name="nid" id="nid" value="<?php echo $news_id; ?>" />

                </form>

这是我的脚本

$.ajaxFileUpload
(
    {
        url:'<?php echo base_url();?>vadmin/ajax/addnews/',
        secureuri:false,
        fileElementId:'userfile',
        dataType: 'json',
        data: $("#newsform").serialize(),
        beforeSend:function()
        {
            $("#loading").show();
        },
        complete:function()
        {
            $("#loading").hide();
        },              
        success: function (resp)
        {
            if(resp.status == 0)
            {
                $('#message').css('color','red');
                $('#message').html(resp.error).show(400);
            }
            if(resp.status == 1)
            {
                $('#message').css('color','green');
                $('#message').html(resp.msg).show(400);
            }
            if(typeof(resp.error) != 'undefined')
            {
                if(resp.error != '')
                {
                    alert(resp.error);
                }else
                {
                    alert(resp.msg);
                }
            }
        },
        /*error: function (resp, status, e)
        {
            alert('ajax error :: '+e);
        }  */
    }
);

1 个答案:

答案 0 :(得分:0)

试试这个

$data = $this->upload->data();          //remove comment
        /*echo "<pre>";
        print_r($data);*/

        /**** assignment of post data ******/
        $title = $this->input->post('title');
        $description = $this->input->post('description');
        $url = $this->input->post('url');
        $userfile = $data['file_name'];                // add this line
        $postedon = $this->input->post('postedon');     
        $source = $this->input->post('source');
        $expiredate = $this->input->post('expiredate');
        $status = $this->default_news_status ;

错误尝试这样

if($this->form_validation->run() == FALSE)
    { 
        echo json_encode(array('status'=>0, 'msg' => validation_errors()));
        exit;
    }