Php 使用带有ajax和formdata的codeigniter上传图像
我喜欢使用PHP中的codeigniter框架和jQueryAjax上传图像，而无需重定向页面。当我上传图像时，它会重定向到控制器区域，并且值不会插入到数据库中，ajax响应也不会出现 谁能解决我的问题。。。。先谢谢你 这是我的查看区域。Php 使用带有ajax和formdata的codeigniter上传图像,php,jquery,ajax,codeigniter,file-upload,Php,Jquery,Ajax,Codeigniter,File Upload,我喜欢使用PHP中的codeigniter框架和jQueryAjax上传图像，而无需重定向页面。当我上传图像时，它会重定向到控制器区域，并且值不会插入到数据库中，ajax响应也不会出现 谁能解决我的问题。。。。先谢谢你 这是我的查看区域。 <form action="<?php echo site_url("Admin_Creator/do_upload")?>" enctype="multipart/form-data" accept-charset="utf-8" nam
<form action="<?php echo site_url("Admin_Creator/do_upload")?>" enctype="multipart/form-data" accept-charset="utf-8" name="formname" id="frm_imageuupload" method="post">
<div class="form-group">
<label for="menu">Select Menu</label>
<select class="form-control" id="selectmenuid">
<option value="">-- Select Menu --</option>
<?php foreach($showData as $show):?>
<option value="<?php echo $show->menu_id?>"><?php echo $show->menu_name?></option>
<?php endforeach;?>
</select>
</div>
<div class="form-group">
<label for="menu">Select Sub Menu</label>
<select class="form-control" id="selectsubmenu">
<option>--Select Sub Menu--</option>
</select>
</div>
<div class="form-group">
<label for="imagetitle">Image Title</label>
<input type="text" class="form-control" name="imagetitle" id="imagetitle" placeholder="Enter Image Title" required="required">
</div>
<div class="control-group form-group">
<div class="controls">
<label>Upload Photo:</label>
<input name="file" type="file" id="image_file" required>
<p class="help-block"></p>
</div>
</div>
<button type="submit" class="btn btn-primary" id="submit">Submit</button>
</form>
public function do_upload(){
$config['upload_path']="./upload";
$config['allowed_types']='gif|jpg|png';
$this->load->library('upload',$config);
if($this->upload->do_upload()){
$data = array('upload_data' => $this->upload->data());
$data1 = array(
'menu_id' => $this->input->post('selectmenuid'),
'submenu_id' => $this->input->post('selectsubmenu'),
'imagetitle' => $this->input->post('imagetitle'),
'imgpath' => $data['upload_data']['file_name']
);
$result= $this->Admin_model->save_imagepath($data1);
if ($result == TRUE) {
echo "true";
}
}
}
$('#submit').on('click',function(){
var inputFile=$('input[name=file]');
var fileToUpload=inputFile[0].files[0];
var other_data = $('#frm_imageuupload').serializeArray();
var formdata=new FormData();
formdata.append(fileToUpload);
formdata.append(other_data);
//now upload the file using ajax
$.ajax({
url:"<?php echo base_url('Admin_Creator/do_upload') ?>",
type:"post",
data:formdata,
processData:false,
contentType:false,
success: function(data){
if (data== 'true'){
window.location.reload();
}
else{
alert("Pls Try Again");
}
}
});
public function save_imagepath($data1)
{
$this->db->insert('images', $data1);
return $this->db->insert_id();
}
问题在于ajax
您应该先停止表单提交
$('form').on('submit',function(e){//bind event on form submit.
e.preventDefault();//stop submit
......... //your other codes
问题在于ajax
您应该先停止表单提交
$('form').on('submit',function(e){//bind event on form submit.
e.preventDefault();//stop submit
......... //your other codes
试试这个。它正在工作-
HTML表单-
<form enctype="multipart/form-data" id="submit">
<div class="form-group">
<label for="menu">Select Menu</label>
<select class="form-control" name="selectmenuid" id="selectmenuid">
<option value="">-- Select Menu --</option>
<?php foreach($showData as $show):?>
<option value="<?php echo $show->menu_id?>"><?php echo $show->menu_name?></option>
<?php endforeach;?>
</select>
</div>
<div class="form-group">
<label for="menu">Select Sub Menu</label>
<select class="form-control" name="selectsubmenu" id="selectsubmenu">
<option>--Select Sub Menu--</option>
</select>
</div>
<div class="form-group">
<label for="imagetitle">Image Title</label>
<input type="text" class="form-control" name="imagetitle" id="imagetitle" placeholder="Enter Image Title" required="required">
</div>
<div class="control-group form-group">
<div class="controls">
<label>Upload Photo:</label>
<input name="file" type="file" id="image_file" required>
<p class="help-block"></p>
</div>
</div>
<button type="submit" class="btn btn-primary" id="sub">Submit</button>
</form>
$('#submit').submit(function(e){
e.preventDefault();
$.ajax({
url:'Your path',
type:"post",
data:new FormData(this),
processData:false,
contentType:false,
cache:false,
async:false,
success: function(data){
alert(data);
}
});
});
public function do_upload(){
$config['upload_path']="./upload";
$config['allowed_types']='gif|jpg|png';
$this->load->library('upload',$config);
if($this->upload->do_upload("file")){
$data = array('upload_data' => $this->upload->data());
$data1 = array(
'menu_id' => $this->input->post('selectmenuid'),
'submenu_id' => $this->input->post('selectsubmenu'),
'imagetitle' => $this->input->post('imagetitle'),
'imgpath' => $data['upload_data']['file_name']
);
$result= $this->Admin_model->save_imagepath($data1);
if ($result == TRUE) {
echo "true";
}
}
}
控制器功能-
<form enctype="multipart/form-data" id="submit">
<div class="form-group">
<label for="menu">Select Menu</label>
<select class="form-control" name="selectmenuid" id="selectmenuid">
<option value="">-- Select Menu --</option>
<?php foreach($showData as $show):?>
<option value="<?php echo $show->menu_id?>"><?php echo $show->menu_name?></option>
<?php endforeach;?>
</select>
</div>
<div class="form-group">
<label for="menu">Select Sub Menu</label>
<select class="form-control" name="selectsubmenu" id="selectsubmenu">
<option>--Select Sub Menu--</option>
</select>
</div>
<div class="form-group">
<label for="imagetitle">Image Title</label>
<input type="text" class="form-control" name="imagetitle" id="imagetitle" placeholder="Enter Image Title" required="required">
</div>
<div class="control-group form-group">
<div class="controls">
<label>Upload Photo:</label>
<input name="file" type="file" id="image_file" required>
<p class="help-block"></p>
</div>
</div>
<button type="submit" class="btn btn-primary" id="sub">Submit</button>
</form>
$('#submit').submit(function(e){
e.preventDefault();
$.ajax({
url:'Your path',
type:"post",
data:new FormData(this),
processData:false,
contentType:false,
cache:false,
async:false,
success: function(data){
alert(data);
}
});
});
public function do_upload(){
$config['upload_path']="./upload";
$config['allowed_types']='gif|jpg|png';
$this->load->library('upload',$config);
if($this->upload->do_upload("file")){
$data = array('upload_data' => $this->upload->data());
$data1 = array(
'menu_id' => $this->input->post('selectmenuid'),
'submenu_id' => $this->input->post('selectsubmenu'),
'imagetitle' => $this->input->post('imagetitle'),
'imgpath' => $data['upload_data']['file_name']
);
$result= $this->Admin_model->save_imagepath($data1);
if ($result == TRUE) {
echo "true";
}
}
}
试试这个。它正在工作-
HTML表单-
<form enctype="multipart/form-data" id="submit">
<div class="form-group">
<label for="menu">Select Menu</label>
<select class="form-control" name="selectmenuid" id="selectmenuid">
<option value="">-- Select Menu --</option>
<?php foreach($showData as $show):?>
<option value="<?php echo $show->menu_id?>"><?php echo $show->menu_name?></option>
<?php endforeach;?>
</select>
</div>
<div class="form-group">
<label for="menu">Select Sub Menu</label>
<select class="form-control" name="selectsubmenu" id="selectsubmenu">
<option>--Select Sub Menu--</option>
</select>
</div>
<div class="form-group">
<label for="imagetitle">Image Title</label>
<input type="text" class="form-control" name="imagetitle" id="imagetitle" placeholder="Enter Image Title" required="required">
</div>
<div class="control-group form-group">
<div class="controls">
<label>Upload Photo:</label>
<input name="file" type="file" id="image_file" required>
<p class="help-block"></p>
</div>
</div>
<button type="submit" class="btn btn-primary" id="sub">Submit</button>
</form>
$('#submit').submit(function(e){
e.preventDefault();
$.ajax({
url:'Your path',
type:"post",
data:new FormData(this),
processData:false,
contentType:false,
cache:false,
async:false,
success: function(data){
alert(data);
}
});
});
public function do_upload(){
$config['upload_path']="./upload";
$config['allowed_types']='gif|jpg|png';
$this->load->library('upload',$config);
if($this->upload->do_upload("file")){
$data = array('upload_data' => $this->upload->data());
$data1 = array(
'menu_id' => $this->input->post('selectmenuid'),
'submenu_id' => $this->input->post('selectsubmenu'),
'imagetitle' => $this->input->post('imagetitle'),
'imgpath' => $data['upload_data']['file_name']
);
$result= $this->Admin_model->save_imagepath($data1);
if ($result == TRUE) {
echo "true";
}
}
}
控制器功能-
<form enctype="multipart/form-data" id="submit">
<div class="form-group">
<label for="menu">Select Menu</label>
<select class="form-control" name="selectmenuid" id="selectmenuid">
<option value="">-- Select Menu --</option>
<?php foreach($showData as $show):?>
<option value="<?php echo $show->menu_id?>"><?php echo $show->menu_name?></option>
<?php endforeach;?>
</select>
</div>
<div class="form-group">
<label for="menu">Select Sub Menu</label>
<select class="form-control" name="selectsubmenu" id="selectsubmenu">
<option>--Select Sub Menu--</option>
</select>
</div>
<div class="form-group">
<label for="imagetitle">Image Title</label>
<input type="text" class="form-control" name="imagetitle" id="imagetitle" placeholder="Enter Image Title" required="required">
</div>
<div class="control-group form-group">
<div class="controls">
<label>Upload Photo:</label>
<input name="file" type="file" id="image_file" required>
<p class="help-block"></p>
</div>
</div>
<button type="submit" class="btn btn-primary" id="sub">Submit</button>
</form>
$('#submit').submit(function(e){
e.preventDefault();
$.ajax({
url:'Your path',
type:"post",
data:new FormData(this),
processData:false,
contentType:false,
cache:false,
async:false,
success: function(data){
alert(data);
}
});
});
public function do_upload(){
$config['upload_path']="./upload";
$config['allowed_types']='gif|jpg|png';
$this->load->library('upload',$config);
if($this->upload->do_upload("file")){
$data = array('upload_data' => $this->upload->data());
$data1 = array(
'menu_id' => $this->input->post('selectmenuid'),
'submenu_id' => $this->input->post('selectsubmenu'),
'imagetitle' => $this->input->post('imagetitle'),
'imgpath' => $data['upload_data']['file_name']
);
$result= $this->Admin_model->save_imagepath($data1);
if ($result == TRUE) {
echo "true";
}
}
}
这就是我为解决那个问题所做的 HTML 模型
class profile_sp_m extends CI_Model
{
public $_tablename = 'profiles';
function __construct()
{
// Call the Model constructor
parent::__construct();
}
public function upload_logo($data) {
$caption = $data['caption'];
$details = $data['details'];
if(isset($_FILES["file"]["type"]))
{
$validextensions = array("jpeg", "jpg", "png");
$temporary = explode(".", $_FILES["file"]["name"]);
$file_extension = end($temporary);
if ((($_FILES["file"]["type"] == "image/png") ||($_FILES["file"]["type"] == "image/jpg") ||
($_FILES["file"]["type"] == "image/jpeg") ) &&
($_FILES["file"]["size"] < 100000) &&
in_array($file_extension, $validextensions)){
if ($_FILES["file"]["error"] > 0)
{
echo "Return Code: " . $_FILES["file"]["error"] . "<br/><br/>";
} else {
$sourcePath = $_FILES['file']['tmp_name']; Store source path in a variable
$targetPath = "uploads/profiles/" . $_FILES['file']['name']; // The Target path where file is to be stored
move_uploaded_file($sourcePath,$targetPath); // Moving Uploaded file
// The Image Data
$imageData = [
'caption' => $caption,
'description' => $details,
];
// Insert the data
$this->db->insert($this->_tablename, $imageData);
}
}
}
}
}
class profile\u sp\m扩展了CI\u模型
{
public$_tablename='profiles'；
函数_u构造（）
{
//调用模型构造函数
父项：：_构造（）；
}
公共功能上传标志（$data）{
$caption=$data['caption']；
$details=$data['details']；
如果（isset（$\u文件[“文件”][“类型”]））
{
$validextensions=数组（“jpeg”、“jpg”、“png”）；
$temporary=explode（“.”，$_文件[“文件”][“名称”]）；
$file_extension=end（$temporary）；
如果（（$_文件[“文件”][“类型”]=“图像/png”）||（$_文件[“文件”][“类型”]=“图像/jpg”）||
（$_文件[“文件”][“类型”]=“图像/jpeg”）&&
（$_文件[“文件”][“大小”]<100000）和
在数组中（$file_扩展名，$validex））{
如果（$\u文件[“文件”][“错误”]>0）
{
回显“返回代码：”.$\u文件[“文件”][“错误”]。“
”；
}否则{
$sourcePath=$\u FILES['file']['tmp\u name']；将源路径存储在变量中
$targetPath=“uploads/profiles/”$\u FILES['file']['name']；//存储文件的目标路径
移动上传的文件（$sourcePath，$targetPath）；//移动上传的文件
//图像数据
$imageData=[
'caption'=>$caption，
'description'=>$details，
];
//插入数据
$this->db->insert（$this->\u tablename，$imageData）；
}
}
}
}
}
class profile_sp_m extends CI_Model
{
public $_tablename = 'profiles';
function __construct()
{
// Call the Model constructor
parent::__construct();
}
public function upload_logo($data) {
$caption = $data['caption'];
$details = $data['details'];
if(isset($_FILES["file"]["type"]))
{
$validextensions = array("jpeg", "jpg", "png");
$temporary = explode(".", $_FILES["file"]["name"]);
$file_extension = end($temporary);
if ((($_FILES["file"]["type"] == "image/png") ||($_FILES["file"]["type"] == "image/jpg") ||
($_FILES["file"]["type"] == "image/jpeg") ) &&
($_FILES["file"]["size"] < 100000) &&
in_array($file_extension, $validextensions)){
if ($_FILES["file"]["error"] > 0)
{
echo "Return Code: " . $_FILES["file"]["error"] . "<br/><br/>";
} else {
$sourcePath = $_FILES['file']['tmp_name']; Store source path in a variable
$targetPath = "uploads/profiles/" . $_FILES['file']['name']; // The Target path where file is to be stored
move_uploaded_file($sourcePath,$targetPath); // Moving Uploaded file
// The Image Data
$imageData = [
'caption' => $caption,
'description' => $details,
];
// Insert the data
$this->db->insert($this->_tablename, $imageData);
}
}
}
}
}
class profile\u sp\m扩展了CI\u模型
{
public$_tablename='profiles'；
函数_u构造（）
{
//调用模型构造函数
父项：：_构造（）；
}
公共功能上传标志（$data）{
$caption=$data['caption']；
$details=$data['details']；
如果（isset（$\u文件[“文件”][“类型”]））
{
$validextensions=数组（“jpeg”、“jpg”、“png”）；
$temporary=explode（“.”，$_文件[“文件”][“名称”]）；
$file_extension=end（$temporary）；
如果（（$_文件[“文件”][“类型”]=“图像/png”）||（$_文件[“文件”][“类型”]=“图像/jpg”）||
（$_文件[“文件”][“类型”]=“图像/jpeg”）&&
（$_文件[“文件”][“大小”]<100000）和
在数组中（$file_扩展名，$validex））{
如果（$\u文件[“文件”][“错误”]>0）
{
回显“返回代码：”.$\u文件[“文件”][“错误”]。“
”；
}否则{
$sourcePath=$\u FILES['file']['tmp\u name']；将源路径存储在变量中
$targetPath=“uploads/profiles/”$\u FILES['file']['name']；//存储文件的目标路径
移动上传的文件（$sourcePath，$targetPath）；//移动上传的文件
//图像数据
$imageData=[
'caption'=>$caption，
'description'=>$details，
];
//插入数据
$this->db->insert（$this->\u tablename，$imageData）；
}
}
}
}
}