Reputation: 65

How to display ajax result in table row

i have a function to insert the value to database . Everything is going well but i am stuck in ajax process to display the current value inserted in the new row of the table. I could not find a way to display or echo the values.I need an immediate help in this .can someone figure out what should i add to .
How can i echo value for ajax result to display in new row.

here is my modal..

    public function pinsert() {
    $amount = $this->input->post('amount');
    $paid_date = $this->input->post('paid_date');
    $project = $this->input->post('e1');

    $data = array(
        'paid_date' => $paid_date,
        'amount' => $amount,
        'pro_id' => $project
    );
    $this->db->insert('payment', $data);
   }

my controller

public function payment_insert() {
        $this->load->model('payment_model');
      $feed= $this->payment_model->pinsert();
      }

And lastly my jquery for ajax

  <script>
        $(document).ready(function() {
                   $(".btn-primary").live('click',function(){
               var post_data=$('.modal-body').find('input,select').serialize();
              // var select=$('select').val();
                 $.ajax(
                    {
                        url: "<?php echo site_url("payment/payment_insert"); ?>",
                        type: 'POST',
                        data: post_data,
                        success: function(result)
                        {
                        // console.log(result);
                             var $tr = $('<tr/>');
$tr.append($('<td/>').html(result.p_id));
$tr.append($('<td/>').html(result.project_title));
$tr.append($('<td/>').html(result.amount));
$tr.append($('<td/>').html(result.paid_date));
$tr.append($('<td/>').html(result.pro_id));
$('.table tr:last').before($tr);
                           //$('#table').html('<tr><td>'+result+'</td></tr>');
                        }
                    });

            return false;
            });

        });
    </script>

Upvotes: 0

Answers (4)

Mohammad Ismail Khan

Reputation: 651

$.ajax({
                    url: "<?php echo site_url("payment/payment_insert"); ?>",
                    type: 'POST',
                    data: post_data,
                    dataType: 'json',
                    success: function(result)
                    {
                     //console.log(result);
                      $.each(result,function(key,value){
                         var NewRow = '<tr><td">'+value.p_id+'</td>';
                             NewRow += '<td>'+value.project_title+'</td>';
                             NewRow += '<td>'+value.amount+'</td>';
                             NewRow += '<td>'+value.paid_date+'</td>';
                             NewRow += '<td>'+value.pro_id+'</td>';
                             NewRow += '</tr>';

                             $(".table").append(NewRow);
                      });
                    }
                });

        return false;
        });

I hope this will solve your problem. when you append a new thing it automatically goes to the end

Upvotes: 2

Mohammad Ismail Khan

Reputation: 651

Well I think you don't need to return the result back from your model WHY? because you sending the data which is enter in the form, so when you are sending data through ajax, don't don't send the whole form by serializing it. Get value of each text field send it as string and if the result is true show that variables in rows but if you still want to show it from data than, after inserting the record through model, than

public function payment_insert() {
    $this->load->model('payment_model');
    $amount = $this->input->post('amount');
    $paid_date = $this->input->post('paid_date');
    $project = $this->input->post('e1');


    $data = array(
       'paid_date' => $paid_date,
       'amount' => $amount,
       'pro_id' => $project
     );

    $feed= $this->payment_model->pinsert($data);
    print json_encode($feed);
  }

public function pinsert($data) {       
   $this->db->insert('payment', $data);
   $last_id = $this->db->last_id();//return last inserted id
   $this->db->where('id',$last_id);
   $query = $this->db->get();
   return $query->result_row();
}

you can also just return the last inserted id and than fetch the record from another function of model by passing this id to it. I hope it will help you

Upvotes: 0