CODEWITHSUNDEEP
jqueryajaxcodeigniter
Rad
Rad

Reputation: 1029

Refresh a div with result after posting to database with ajax and codeigniter

I am writing a Codeigniter app, and I use ajax to send data to my controller/method, and would like to know how to refresh a div using ajax without reloading the entire page (the path from db to view using ajax is still confusing for me)

I use this code to send data to the database 

<script>

         $(function(){
        $("#rate").submit(function(){
         dataString = $("#rate").serialize();

         $.ajax({
           type: "POST",
           url: "<?php echo base_url(); ?>product/rate",
           data: dataString,

        });
    </script>

The posting to the db works just fine.

Then I have a div in the view that will get the result from the database so I append the code like :

<script>

         $(function(){
        $("#rate").submit(function(){
         dataString = $("#rate").serialize();

         $.ajax({
           type: "POST",
           url: "<?php echo base_url(); ?>product/rate",
           data: dataString,


         dataType: "html",
           success: function(data){
                $('#result').html(data);
           }

         });

         return false;  //stop the actual form post !important!

        });
        });
    </script>

but nothing happens (I followed some snippets on the net)

Can anyone guide me through ?

Thanks

UPDATE //Controller

function rate(){

            if ($this->input->post('e1') || $this->input->post('e2') || $this->input->post('e3') || $this->input->post('e4') || $this->input->post('e5'))
            {
                $this->Mproduct->rateProduct();
                                $this->db->cache_delete_all();

            }

        }

//Model

public function rateProduct()
    {
      $data = array('usage' => $_POST['e1'],
                    'packing' => $_POST['e2'],
                    'size' => $_POST['e3'],
                    'recycling' => $_POST['e4'],
                    'material'=>$_POST['e5'],
                    'idUser'=>$_POST['idUser'],
                    'idProduct' => $_POST['idProduct']
                    );


        $this->db->insert('Rating', $data);
    }

Upvotes: 0

Views: 5092

Answers (3)

Erik Bongers
Erik Bongers

Reputation: 462

To get rid of the ob_start() error, add $config['compress_output'] = FALSE; to config.php or set it to false via code:

$this->config->set_item('compress_output', FALSE);

Upvotes: 0

Erik Bongers
Erik Bongers

Reputation: 462

As an indirect answer to your question that "nothing happens", I would suggest a strategy to make sure you that you see at least something happening.

  1. in addition to the success: handler, also add an error: handler with an alert() or something.
  2. in your success handler, add a debugger; statement as the first line. This will cause your browser (chrome, when the development area is visible) to pause execution. This way you can inspect the content of the data variable.


    $.ajax({
       type: "POST",
       url: "product/rate",
       data: dataString,
       dataType: "html",
       success: function(data){
            debugger;
            $('#result').html(data);
            },
       error: function() { alert("oops..."); }
       });

UPDATE: In any case, your rate() member of the controller should return some valid html, but not directly via echo statements but via a view, as described here:
Codeingiter, manual, static pages



    function rate()
        {
        //...
        $this->load->view('rate/view', $data);
        }

given that you have a file application/views/rate/view.php:



    <?php
    echo 'TODO: put some html code...';

Upvotes: 1

Diego Tolentino
Diego Tolentino

Reputation: 29

Try output some data into rate() function, like:

echo "<b>Response to return</b>";

Upvotes: 1

Related Questions