cakephp saving data without reload page

Question

I have a label called price, and this label automatically updates its value every two seconds from the server. Also I have a button or link, which increases this price in database when I do click. The problem is how save the data without redirect to the same page.

My code:

<?php 
echo $this->html->link('Increase price', array('controller' => 'example', 'action' => 'increase_price', $param1), array ('id' => 'btPrice'));
?>

And in ExampleController the code is

    function increase_price($param1) 
    {
        $this->autoRender = false; //Don't want a view

        $example = $this->Example->findById($param1);
        $example ['Example ']['price'] = $example ['Example ']['price'] + 1;
        $this->Example->save($example );


    }

The price is increased but cakePhp is asking me for a view, and if I do autoRender=false then my page will be blank and I want to stay on the same page. I don't know if this is a CakePhp question or if is Jquery question. In both cases, I appreciate your help

Geoffreyirl · Accepted Answer · 2013-09-10 23:34:29Z

if you don't wanna reload the page to do this, you need to use Ajax..since you've already got unique id for this, what you need to do is use Jquery Ajax to handle this.

first download jquery lib and put it into your app/webroot/js folder and load it

http://jquery.com/download/ download Jquery lib here

then you can do:

<script>
$( document ).ready(function() {
//do sth when click on #btPrice
   $('#btPrice').click(function(){  
        $.ajax({        
            type:"POST",
            //the function u wanna call
            url:"<?php echo $this->webroot;?>example/increase_price/",
            /* data you wanna pass, as your $param1 is serverSide variable, 
               you need to first assign to js variable then you can pass: 
               var param1 =      '<?php echo $param1;?>';*/                  
            data:{increase_price:param1},               
            success:function(data)
            {
                //update your div
            }
        });
   });
});
</script>

Also you have to modify your increase_price function

As we are passing increse_price as parameter in ajax call and method is post, in your function, you have to use $_POST['increase_price'] to catch it then assign to another variable

eg: $param1 = $_POST['increase_price']; then you can use it..

Should do the trick for you

user221931 · Accepted Answer · 2013-09-10 23:22:00Z

1

The normal flow is that when you click on a link, the browser requests a new page from the server and then renders the contents.

If you want to change something in the DOM from the client's side you need Javascript.

With the use of Javascript you can skip the complete page reload because you can request the exact information you need and then update the DOM with it. This is known as AJAX.

While you can do AJAX with plain Javascript it is usually much easier to use a Javascript framework like jQuery to make things easier.

answered Sep 10, 2013 at 23:22

user221931

1,8521 gold badge13 silver badges16 bronze badges

Collectives™ on Stack Overflow

cakephp saving data without reload page

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related