[英]How to upload file using ajax in codeigniter
我正在尝试使用ajax上传文件以及其他参数。 但是,文件未上载。
表格代码
<form id="first_form" method="post" enctype="multipart/form-data">
<input type="file" id="file" name="file" accept="image/*" onchange="loadFile(event)">
<input type="text" data-validation="url" class="form-control" id="first_name" name="first_name" placeholder="First Name" />
<input type="text" class="form-control" id="last_name" name="last_name" placeholder="Last Name" />
<input type="image" src="<?php echo base_url(); ?>assets/images/icon/_Save.png" class="Save-container img-circle" id="submit_first_form">
</form>
脚本代码
<script type="text/javascript">
$(document).ready(function() {
$("#submit_first_form").click(function(event) {
event.preventDefault();
var file = $("input#file").val();
var first_name = $("input#first_name").val();
var last_name = $("input#last_name").val();
jQuery.ajax({
type: "POST",
url: "<?php echo base_url(); ?>" + "student/add_data",
dataType: 'json',
data: {
file: file,
first_name: first_name,
last_name: last_name
},
success: function(res) {
if (res)
{
console.log(res);
}
}
}); }); });
</script>
控制器代码
public function add_data()
{
$data = array(
'file' => $this->input->post('file'),
'first_name' => $this->input->post('first_name'),
'last_name'=>$this->input->post('last_name')
);
$status = "";
$msg = "";
$file_element_name = $data['file'];
$config['upload_path'] = 'www.localhost.com/project/assets/supplier';
$config['allowed_types'] = 'gif|jpg|png|doc|txt';
$config['max_size'] = 1024 * 8;
$config['encrypt_name'] = TRUE;
$this->load->library('upload', $config);
if (!$this->upload->do_upload($file_element_name))
{
$status = 'error';
$msg = $this->upload->display_errors('', '');
}
else
{
$data = $this->upload->data();
//$data['file_name']
$status = "success";
$msg = "File successfully uploaded";
}
echo json_encode(array('status' => $status, 'msg' => $msg));
}
我进入控制台的错误是:
{状态:“错误”,信息:“您没有选择要上传的文件。”}
谁能告诉我如何上传文件
尝试将以下代码用于脚本:
<script type="text/javascript">
$(document).ready(function() {
$("#submit_first_form").click(function(event) {
event.preventDefault();
var form_data = new FormData($('#first_form')[0]);
jQuery.ajax({
type: "POST",
url: "<?php echo base_url(); ?>" + "student/add_data",
data: form_data,
processData: false,
contentType: false,
success: function(res) {
if (res)
{
console.log(res);
}
}
}); }); });
</script>
<form id="first_form" method="post" enctype="multipart/form-data">
文件上传时的enctype。
->在表单标签中提交ID,然后在表单关闭脚本之前添加提交按钮以发送请求$(“#save”)。click(function(event){event.preventDefault();
// Create an FormData object
var data1 = new FormData($('#fileUploadForm')[0]);
console.log($('#fileUploadForm'));
$.ajax({
type: "POST",
enctype: 'multipart/form-data',
url: "<?php echo base_url(); ?>" + "student/add_data",
data: data1,
processData: false,
contentType: false,
cache: false,
success: function (data) {
data = JSON.parse(data);
console.log(data);
if(data.id==1)
{
localStorage.setItem("user_profile_pic", data.user_pic);
alert("updated sucessfully")
}
}
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.