使用DataTables的Codeigniter Ajax Crud - 插入_添加数据

时间:2016-12-15 13:43:18

标签: codeigniter twitter-bootstrap-3 datatables

有来自weblesson youtube页面的这个codeigniter教程关于使用Datatables和Codeigniter。

但是我在将数据插入数据库时​​遇到了一些困难。

控制器:

function user_action(){  
       if($_POST["action"] == "Add")  
       {  
            $insert_data = array(  
                 'first_name' => $this->input->post('first_name'),  
                 'last_name' => $this->input->post("last_name"),  
                 'image' => $this->upload_image()  
            );  
            $this->load->model('crud_model');  
            $this->crud_model->insert_crud($insert_data);  
            echo 'Data Inserted';  
       }  
  }  
  function upload_image()  
  {  
       if(isset($_FILES["user_image"]))  
       {  
            $extension = explode('.', $_FILES['user_image']['name']);  
            $new_name = rand() . '.' . $extension[1];  
            $destination = './upload/' . $new_name;  
            move_uploaded_file($_FILES['user_image']['tmp_name'], $destination);  
            return $new_name;  
       }  
  }  

查看课程:

<div id="userModal" class="modal fade">  
  <div class="modal-dialog">  
       <form method="post" id="user_form">  
            <div class="modal-content">  
                 <div class="modal-header">  
                      <button type="button" class="close" data-dismiss="modal">&times;</button>  
                      <h4 class="modal-title">Add User</h4>  
                 </div>  
                 <div class="modal-body">  
                      <label>Enter First Name</label>  
                      <input type="text" name="first_name" id="first_name" class="form-control" />  
                      <br />  
                      <label>Enter Last Name</label>  
                      <input type="text" name="last_name" id="last_name" class="form-control" />  
                      <br />  
                      <label>Select User Image</label>  
                      <input type="file" name="user_image" id="user_image" />  
                 </div>  
                 <div class="modal-footer">  
                      <input type="submit" name="action" class="btn btn-success" value="Add" />  
                      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>  
                 </div>  
            </div>  
       </form>  
  </div>  

当我运行此代码时,我收到以下错误:

Error message

当我做的时候

if(isset($_POST["action"]) && $_POST["action"] == "Add")

我有一个空警报框

2 个答案:

答案 0 :(得分:0)

在控制器中,在构造函数中加载url帮助器。并使用代码::

将文件保存为Main.php
function __construct()
  {
    $this->load->helper('url');
  }
  function user_action(){  
       if($_POST["action"] == "Add")  
       {  
            $insert_data = array(  
                 'first_name' => $this->input->post('first_name'),  
                 'last_name' => $this->input->post("last_name"),  
                 'image' => $this->upload_image() 
            );  
            $this->load->model('crud_model');  
            $this->crud_model->insert_crud($insert_data);  
            echo 'Data Inserted';  
       }  
  }  
  function upload_image()  
  {  
       if(isset($_FILES["user_image"]))  
       {  
            $extension = explode('.', $_FILES['user_image']['name']);  
            $new_name = rand() . '.' . $extension[1];  
            $destination = './upload/' . $new_name;  
            move_uploaded_file($_FILES['user_image']['tmp_name'], $destination);  
            return $new_name;  
       }  
  }  

在您的视图中定义类型hidden的输入,其中包含名称操作和值add.And定义表单的操作。如下所示..

<div id="userModal" class="modal fade">  
  <div class="modal-dialog">  
       <form method="post" id="user_form" action="<?php echo base_url('main/user_action');?>">  
       <input type="hidden" name="action" value="add">
            <div class="modal-content">  
                 <div class="modal-header">  
                      <button type="button" class="close" data-dismiss="modal">&times;</button>  
                      <h4 class="modal-title">Add User</h4>  
                 </div>  
                 <div class="modal-body">  
                      <label>Enter First Name</label>  
                      <input type="text" name="first_name" id="first_name" class="form-control" />  
                      <br />  
                      <label>Enter Last Name</label>  
                      <input type="text" name="last_name" id="last_name" class="form-control" />  
                      <br />  
                      <label>Select User Image</label>  
                      <input type="file" name="user_image" id="user_image" />  
                 </div>  
                 <div class="modal-footer">  
                      <input type="submit" name="action" class="btn btn-success" value="Add" />  
                      <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>  
                 </div>  
            </div>  
       </form>  
  </div>

希望它能起作用..

答案 1 :(得分:0)

我确实解决了问题,但不知道这是否是最好的方法

我所做的是改变这两个代码:

控制器:

public function user_action(){  
       if(isset($_POST["action"]) && $_POST["action"] == "Add")  
       {  
            $insert_data = array(  
                 'first_name'          =>     $this->input->post('first_name'),  
                 'last_name'               =>     $this->input->post("last_name"),  
                 'image'                    =>     $this->upload_image()  
            );  
            $this->load->model('crud_model');  
            $this->crud_model->insert_crud($insert_data);  
            echo 'Data Inserted';  

  }  

和Ajax:

$(document).on('submit', '#user_form', function(event){  
       event.preventDefault();  
       var firstName = $('#first_name').val();  
       var lastName = $('#last_name').val();  
       var extension = $('#user_image').val().split('.').pop().toLowerCase();  
       if(jQuery.inArray(extension, ['gif','png','jpg','jpeg']) == -1)  
       {  
            alert("Invalid Image File");  
            $('#user_image').val('');  
            return false;  
       }  
       if(firstName != '' && lastName != '')  
       {  
            $.ajax({  
                 url:"<?php echo base_url() . 'main/user_action'?>",  
                 method:'POST',  
                 data:new FormData(this),  
                 contentType:false,  
                 processData:false,  
                 success:function(data)  
                 {  
                      alert(data);  
                      $('#user_form')[0].reset();  
                      $('#userModal').modal('hide');  
                      dataTable.ajax.reload();  
                 }  
            });  
       }  
       else  
       {  
            alert("Bother Fields are Required");  
       }  
  });  
控制器

它说:

if(isset($_POST["action"]) && $_POST["action"] == "Add")

将其删除

在Ajax代码中:

创建一个链接变量来获取表单的action属性,如下所示:

var link = $('#user_form').attr('action');  

并将其解析为ajax网址。

那就是它!