Ajax图片上传刷新页面?

时间:2013-09-26 12:56:11

标签: php jquery ajax

我想知道,为什么我的页面正在刷新,而我使用ajax上传图片,我试图调试问题,但没找到,

这是Controller功能,

public function uploadImage() {
    if(isset($_FILES['header_image'])) {
        $config['upload_path'] = 'public/images/global/';
        $config['allowed_types'] = 'gif|jpg|png';
        $config['file_name'] = 'b_'.random_string('alnum', 5);
        $this->upload->initialize($config);

        if($this->upload->do_upload('header_image')) {
            echo json_encode(array('status'=>"1", 'image_url'=>$this->upload->file_name));
        } else {
            $upload_error = array('error' => $this->upload->display_errors());
            echo json_encode(array('status'=>"0",'upload_error'=>strip_tags($upload_error['error'])));
        }
        exit;
    }
    $this->template->render();
}

虽然我的观点是uploadImage.php,但

$(document).ready(function() {
$('#header_image').on('change', function(){
    $("#frm_global").ajaxForm({
        success: function(data) {
            res = $.parseJSON(data);
            if(res.status == 1){
                var html = "<img src='<?=base_url();?>path/"+res.image_url+"' class='preview' width='100' height='100' />";
                    html+= "<input type='hidden' id='image_url' name='image_url' value='"+res.image_url+"' >";
                    $("#preview").html(html);
                    $("#frm_global").ajaxFormUnbind();
            }
            if(res.status == 0){
                $("#frm_global").ajaxFormUnbind();
            }
        }
    }).submit();
});
});

<form name="frm_global" id="frm_global" enctype="multipart/form-data">
<div id="preview" style="float:left">
</div>
<div style="float:left">
    <div style="margin-top:25px">
        <input type="file" name="header_image" id="header_image"/>
        <input style="margin-left:100px" onclick="" type="image" id="upload_header" src="any path" />
    </div>
</div>
</form>

1 个答案:

答案 0 :(得分:0)

抱歉,我认为我没有正确回答你的问题。

但是提交你可以尝试这样

$("#theForm").ajaxForm({
url: 'server.php',
type: 'post',
success:function(data)
{
//do what you want to
}
});

可能对你有所帮助