Question

我在视图页面中提交了一个表单，我想，当我点击提交按钮时，表单数据需要保存在数据库表中，并且该数据需要在没有刷新页面的情况下显示在表中。

这是我的观看代码：

<div class="col-md-12">
<div class="row">
<div>
<table class="table table-striped table-hover table-responsive">
<thead>
<tr class="">
  <th>Director</th>
  <th>Partner</th>
  <th>Duration</th> 
  <th>Comments</th>
</tr>
</thead>
<tbody id="hodm_results">

</tbody>
</table> 
</div>
</div>
</div>


<?php
$attributes = array('class' => 'form-horizontal','id'=>'hodm_comments');
echo form_open('', $attributes);
?>
<div class="row">
<div class="col-md-12">
<div class="col-sm-3">
  <div class="input-group">
  <span>Director</span>
  <?php echo form_input(['class'=>'form-control autofocus','id'=>'director','name'=>'director','value'=>set_value('director',$wip->director)]); ?>
   </div>
</div>
<div class="col-sm-3">
  <div class="input-group">
  <span>Partner</span>
  <?php echo form_input(['class'=>'form-control autofocus','id'=>'partner','name'=>'partner','value'=>set_value('partner',$wip->partner)]); ?>
   </div>
</div>
<div class="col-sm-3">
  <div class="input-group">
  <span>Duration</span>
  <?php echo form_input(['class'=>'form-control autofocus','id'=>'duration','name'=>'duration']); ?>
   </div>
</div>
<div class="col-sm-3">
  <div class="input-group">
  <span>Comments</span>
  <?php echo form_textarea(['class'=>'form-control autofocus','id'=>'comments','name'=>'comments','rows'=>'3']); ?>
  <input type="hidden" name="id_hidden" value="<?php echo $wip->id; ?>">
   </div>
</div>
</div>
</div>
<input class="btn btn-primary" type="submit" name="submit" value="submit">
<?php 
echo form_close();
?>
</section>
<!--main content end-->
</section>

这是我的JQuery代码：

<script type='text/javascript' language='javascript'>
$('#hodm_comments').submit(function (event) {
$.ajax({
url:"<?php echo base_url();?>digital/dashboard/insert_hodm_comments",
type: 'POST',
dataType: 'JSON',

success:function (data) {
$('#hodm_results').html(data);
}
});

event.preventDefault();
});
</script>

这是我的控制器代码：

public function insert_hodm_comments(){
/* Checking the all validation of Hodm Comment form form*/
$this->form_validation->set_rules('director', 'Name of Director', 'required');
$this->form_validation->set_rules('partner', 'Partner', 'required');
$this->form_validation->set_rules('duration', 'No Of Hours', 'required');
$this->form_validation->set_rules('comments', 'Comments of the task', 'required');

if ($this->form_validation->run()) {
/* Taking the data from form*/
$partner    = $this->input->post('partner');
$director   = $this->input->post('director');
$duration   = $this->input->post('duration');
$comments   = $this->input->post('comments');
$id         = $this->input->post('id_hidden');

$data = array(
'partner'           =>$partner,
'director'          =>$director,
'duration'          =>$duration,
'comments'          =>$comments,
'hodm_id'           =>$id
); 

$add=$this->pojo->add_hodm_comments($data);
/* Display Success message if data inserted successfully in database*/

if($add){
$result_html = '';
$result_set = $this->pojo->get_hodm_comments();

foreach($result_set as $result) {
$result_html .= '
    <tr>
        <td>' . $result->director . '</td>
        <td>' . $result->partner . '</td>
        <td>' . $result->duratrion . '</td>
        <td>' . $result->comments . '</td>
    </tr>';                   

}

echo json_encode($result_html);
//$this->session->set_flashdata('hodm_form',"All HODM Data Inserted Successfully.");
//$this->session->set_flashdata('hodm_form_class','alert-success');
}else{
/* Displaying the error message*/
$this->session->set_flashdata('hodm_form',"failed to add, Please Try again");
$this->session->set_flashdata('hodm_form_class','alert-danger');
}
return redirect('digital/dashboard/wip_hodm_comments_section');
} else {
$this->load->view('digital/hodm/dashboard_hodm_work/wip_hodm_comments');
}
}

这是模特：

public function add_hodm_comments($data){

    $this->db->insert('hodm_wip_comments', $data);
    return TRUE;

  }

   public function get_hodm_comments(){
    $this->db->select('*');
    $this->db->from('hodm_wip_comments');
    $query=$this->db->get();
    return $result=$query->result();
  }

请帮助我找到我在此代码中遇到的解决方案。

谢谢

Answer 1

只需将您的ajax部分更改为

<script type='text/javascript' language='javascript'>
$('#hodm_comments').submit(function (event) {
$.ajax({
url:"<?php echo base_url();?>digital/dashboard/insert_hodm_comments",
type: 'POST',
data : $('#hodm_comments').serialize(),
success:function (data) {
$('#hodm_results').html(data);
}
});

event.preventDefault();
});
</script>

并在您的控制器中将此echo json_encode($result_html);更改为echo $result_html;

这对我的代码来说非常完美：）

Answer 2

你可以做的只是在控制器函数中回显响应，获取ajax调用的返回数据并将其添加到div中或作为现有表中的tr。

使用ajax进行codeigniter表单提交并在表中显示返回数据

2 个答案: