我使用jQuery模式和Ajax为我的表单提交数据和文件,但我不知道如何使用文件上传类在根文件夹中上传我的文件和图像。任何一个告诉我在哪里我必须在我的代码中添加带有ajax的上传功能。我真的需要这个。我已经完成了这些更改。
下面我附上了我的模态代码和查看代码供你参考:
型号代码:
function __construct()
{
// Call the Model constructor
parent::__construct();
$this->load->database();
}
public function getAll(){
$this->db->select('*');
$this->db->from('emp');
$this->db->limit(50);
$this->db->order_by('id','ASC');
$query = $this->db->get();
return $query->result();
}
public function get($id){
$query = $this->db->get_where('emp',array('id'=>$id));
return $query->row_array();
}
public function save(){
$config['upload_path'] = './uploads/';
$config['overwrite'] = TRUE;
$config['allowed_types'] = 'gif|jpg|png|jpeg|pdf|txt|sql';
$config['max_size'] = 8048000;
$config['max_width'] = 1024;
$config['max_height'] = 768;
$this->load->library('upload', $config);
if ( $this->upload->save('userfile')) {
$data = array('upload_data' => $this->upload->data());
$Firstname = $this->input->post('Firstname');
$Lastname = $this->input->post('Lastname');
$Email = $this->input->post('Email');
$Phone = $this->input->post('Phone');
$Address = $this->input->post('Address');
$Password = $this->input->post('Password');
$Status = $this->input->post('Status');
$Createddate = $this->input->post('Createddate');
$Updateddate = $this->input->post('Updateddate');
$File = $data['upload_data']['file_name'];
// print_r($File);
// die;
$data = array(
'Firstname' => $Firstname,
'Lastname' => $Lastname,
'Email' => $Email,
'Phone' => $Phone,
'Address' => $Address,
'Password' => $Password,
'Status' => $Status,
'Createddate' => $Createddate,
'Updateddate' => $Updateddate,
'File' => $File
);
// print_r($data);die;
$this->db->insert('emp',$data);
}
}
public function update(){
$id = $this->input->post('id');
$Firstname = $this->input->post('Firstname');
$Lastname = $this->input->post('Lastname');
$Email = $this->input->post('Email');
$Phone = $this->input->post('Phone');
$Address = $this->input->post('Address');
$Password = $this->input->post('Password');
$Status = $this->input->post('Status');
$Createddate = $this->input->post('Createddate');
$Updateddate = $this->input->post('Updateddate');
$File = $this->input->post('File');
$data = array(
'Firstname' => $Firstname,
'Lastname' => $Lastname,
'Email' => $Email,
'Phone' => $Phone,
'Address' => $Address,
'Password' => $Password,
'Status' => $Status,
'Createddate' => $Createddate,
'Updateddate' => $Updateddate,
'File' => $File
);
$this->db->where('id',$id);
$this->db->update('emp',$data);
}
}
?>
查看代码:
<html lang="en-US">
<head>
<title>Emp Details</title>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/base/jquery-ui.css" type="text/css" media="all"/>
<link rel="stylesheet" href="http://static.jquery.com/ui/css/demo-docs-theme/ui.theme.css" type="text/css" media="all" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/jquery-ui.min.js" type="text/javascript"></script>
<!-- <script src="http://jquery-ui.googlecode.com/svn/tags/latest/external/jquery.bgiframe-2.1.2.js" type="text/javascript"></script>-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-bgiframe/2.1.2/jquery.bgiframe.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/i18n/jquery-ui-i18n.min.js" type="text/javascript"></script>
<meta charset="UTF-8">
<style>
body { font-size: 75%; }
label, input { display:block; width:120%; }
input.text { margin-bottom:12px; width:150%; padding: .10em; }
h1 { font-size: 1.2em; margin: .3em 0; }
a{text-decoration:none;}
{font-size:30%};
</style>
<script>
$(document).ready(function() {
$( "#dialog:ui-dialog" ).dialog( "destroy" );
$( "#dialog-confirm" ).dialog({
autoOpen: false,
resizable: true,
height:150,
modal: true,
hide: 'Slide',
buttons: {
"Delete": function() {
var del_id = {id : $("#del_id").val()};
$.ajax({
type: "POST",
url : "<?php echo site_url('Employee_controller/delete')?>",
data: del_id,
success: function(msg){
$('#show').html(msg);
$('#dialog-confirm' ).dialog( "close" );
//$( ".selector" ).dialog( "option", "hide", 'slide' );
}
});
},
Cancel: function() {
$( this ).dialog( "close" );
}
}
});
$( "#form_input" ).dialog({
autoOpen: false,
height: 450,
width: 450,
modal: false,
hide: 'Slide',
buttons: {
"Add": function() {
var form_data = {
id: $('#id').val(),
Firstname: $('#Firstname').val(),
Lastname: $('#Lastname').val(),
Email: $('#Email').val(),
Phone: $('#Phone').val(),
Address: $('#Address').val(),
Password: $('#Password').val(),
Status: $('#Status').val(),
Createddate: $('#Createddate').val(),
Updateddate: $('#Updateddate').val(),
File: $('#userfile').val(),
ajax:1
};
$('#Firstname').attr("disabled",true);
$('#Lastname').attr("disabled",true);
$('#Email').attr("disabled",true);
$('#Phone').attr("disabled",true);
$('#Address').attr("disabled",true);
$('#Password').attr("disabled",true);
$('#Status').attr("disabled",true);
$('#Createddate').attr("disabled",true);
$('#Updateddate').attr("disabled",true);
$('#userfile').attr("disabled",true);
$.ajax({
url : "<?php echo site_url('Employee_controller/submit')?>",
type : 'POST',
data : form_data,
success: function(msg){
$('#show').html(msg),
$('#id').val(''),
$('#Firstname').val(''),
$('#Lastname').val(''),
$('#Email').val(''),
$('#Phone').val(''),
$('#Address').val(''),
$('#Password').val(''),
$('#Status').val(''),
$('#Createddate').val(''),
$('#Updateddate').val(''),
$('#userfile').val(''),
$('#Firstname').attr("disabled",false);
$('#Lastname').attr("disabled",false);
$('#Email').attr("disabled",false);
$('#Phone').attr("disabled",false);
$('#Address').attr("disabled",false);
$('#Password').attr("disabled",false);
$('#Status').attr("disabled",false);
$('#Createddate').attr("disabled",false);
$('#Updateddate').attr("disabled",false);
$('#userfile').attr("disabled",false);
$( '#form_input' ).dialog( "close" )
}
});
},
Cancel: function() {
$('#id').val(''),
$('#Firstname').val(''),
$('#Lastname').val(''),
$('#Email').val(''),
$('#Phone').val(''),
$('#Address').val(''),
$('#Password').val(''),
$('#Status').val(''),
$('#Createddate').val(''),
$('#Updateddate').val(''),
$('#userfile').val(''),
$( this ).dialog( "close" );
}
},
close: function() {
$('#id').val(''),
$('#Firstname').val(''),
$('#Lastname').val(''),
$('#Email').val(''),
$('#Phone').val(''),
$('#Address').val(''),
$('#Password').val(''),
$('#Status').val(''),
$('#Createddate').val(''),
$('#Updateddate').val(''),
$('#userfile').val('')
}
});
$( "#create-daily" )
.button()
.click(function() {
$( "#form_input" ).dialog( "open" );
});
});
$(".edit").live("click",function(){
var id = $(this).attr("id");
var Firstname = $(this).attr("Firstname");
var Lastname = $(this).attr("Lastname");
var Email = $(this).attr("Email");
var Phone = $(this).attr("Phone");
var Address = $(this).attr("Address");
var Password = $(this).attr("Password");
var Status = $(this).attr("Status");
var Createddate = $(this).attr("Createddate");
var Updateddate = $(this).attr("Updateddate");
var File = $(this).attr("userfile");
$('#id').val(id);
$('#Firstname').val(Firstname);
$('#Lastname').val(Lastname);
$('#Email').val(Email);
$('#Phone').val(Phone);
$('#Address').val(Address);
$('#Password').val(Password);
$('#Status').val(Status);
$('#Createddate').val(Createddate);
$('#Updateddate').val(Updateddate);
$('#userfile').val(File);
$( "#form_input" ).dialog( "open" );
return false;
});
$(".delbutton").live("click",function(){
var element = $(this);
var del_id = element.attr("id");
var info = 'id=' + del_id;
$('#del_id').val(del_id);
$( "#dialog-confirm" ).dialog( "open" );
return false;
});
</script>
</head>
<body>
<p>
<button id="create-daily">Add New</button>
</p>
<div id="show">
<?php $this->load->view('emp/show'); ?>
</div>
<div id="form_input">
<table border="1">
<?php echo form_open('Employee_controller/submit'); ?>
<input type="hidden" value='' id="id" name="id">
<tr >
<td> <?php echo form_label('Firstname : '); ?></td>
<td> <?php echo form_input('Firstname','','id="Firstname"'); ?></td>
</tr>
<tr>
<td> <?php echo form_label('Lastname : ');?> </td>
<td> <?php echo form_input('Lastname','','id="Lastname"'); ?></td>
</tr>
<tr>
<td> <?php echo form_label('Email : ');?> </td>
<td> <?php echo form_input('Email','','id="Email"'); ?></td>
</tr>
<tr >
<td> <?php echo form_label('Phone : '); ?></td>
<td> <?php echo form_input('Phone','','id="Phone"'); ?></td>
</tr>
<tr>
<td> <?php echo form_label('Address : ');?> </td>
<td> <?php echo form_input('Address','','id="Address"'); ?></td>
</tr>
<tr>
<td> <?php echo form_label('Password : ');?> </td>
<td> <?php echo form_input('Password','','id="Password"'); ?></td>
</tr>
<tr >
<td> <?php echo form_label('Status : '); ?></td>
<td> <?php echo form_input('Status','true','id="Status"'); ?></td>
</tr>
<tr>
<td> <?php echo form_label('Createddate : ');?> </td>
<td> <?php echo form_input('Createddate','','id="Createddate"'); ?></td>
</tr>
<tr>
<td> <?php echo form_label('Updateddate : ');?> </td>
<td> <?php echo form_input('Updateddate','','id="Updateddate"'); ?></td>
</tr>
<tr>
<td> <?php echo form_label('File : ');?> </td>
<td><input type="file" name="userfile" id = "userfile" size="20" /></td>
</tr>
</table>
</div>
<div id="dialog-confirm" title="Delete Item ?">
<p>
<span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>
<input type="hidden" value='' id="del_id" name="del_id">
Are you sure?</p>
</div>
</body>
</html>
答案 0 :(得分:0)
upload image using codeigniter with ajax and formdata
在表格属性中使用enctype =“multipart / form-data”。你没有按照我的说法宣布表格。
请按照链接为我工作。