Sunday, May 26, 2013

Re: Cakephp Ajax helper or Jquery?

Find the parts in the returned html chunk.

  success: function (html) {

     // wrap the returned html, JQuery requires this step.
     var $html = $('<html />').html(html);

     // Replace the record
     $record.replaceWith($html);

     // Show message to user
     var $message = $html.find('#flashMessage');
     $message.show();

 }

Nothing changes, no need to send back Json or anything. It just works. Although I do send back a JSON object when necessary, but for the most part I use this technique and it works well.

On Sunday, May 26, 2013 6:26:19 PM UTC+10, advantage+ wrote:

But with that JS you show no response type.

 

Success? Did it do what it was intended? No message, no alert nothing. If you sent a form did it save?  Any error messages for the user?

 

This is a much better way::

 

function sendData(sel){

       var $form = $(sel);

       $(sel).submit(function(e) {

              e.preventDefault();

                    

              $.ajax({

                     type: "POST",

                     url: $(sel).attr('action'),

                     data: $(sel).formSerialize(),

                     dataType: 'json',

             

                     error: function(response,error) {

                           if (error == "timeout") {

                                  $('div#backdata').unblock();

                                  serverTimeout();

                           }

                     },

             

                     success: function(r){

                           $('#backdata').html(r.html);

                          

                           if (r.status === true) {

                                  successMessage(r.message);

                           } else {

                                  failureMessage(r.message);

                           }

                     }

              });

       return false;

       });

};

 

And I have cake create the array of info $response = array('message' => Good stuff it saved, 'html' => grab my view / element whatever…., 'status' => true, anything else you want to add.)

 

And just server it up as a json response and presto!

 

From: cake...@googlegroups.com [mailto:cake...@googlegroups.com] On Behalf Of Leigh Mackay
Sent: Sunday, May 26, 2013 2:32 AM
To: cake...@googlegroups.com
Subject: Re: Cakephp Ajax helper or Jquery?

 

Hi Sam,

 

Progressive enhancement is a very elegant solution for Ajax and UI. 

 

Build your app without any Ajax/JavaScript. Use the app controllers before filter to change the layout on ajax requests.

 

public function beforeFilter() {

 

if ($this->request->is('ajax')) {

  $this->disableCache(); 

  $this->layout = 'ajax'; 

}

 

}

 

Ajax requests end up looking something like this.

 

            $.ajax({

              data: $form.serialize(),

              method: 'POST',

          dataType: 'html',

              url: $form.attr('action'),

              success: function (html) {

                 var $html = $('<html />').html(html);

              // do whatever you want with the returned chunk of html

              // example: grab the flash message and fade it in

             // make a chicken titty dance

                 }

              });     

 

 

Used to-do ajax similar to the Rails convention by sending JavaScript to the browser from a separate view template. Most people find progressive enhancement so much easier to maintain and it makes front end people happy.

 

Another tip is to attach your JavaScript handlers to html5 data attributes instead of css selectors. It's another separation and makes things even easier to maintain.

 

Leigh

 


On Friday, May 24, 2013 7:21:45 PM UTC+10, Sam wrote:

Hi Cakephp experts,

 

I would like to try out Ajax. May I know what are the pros and cons of Cakephp Ajax helper and Jquery? I have never touched ajax and would like to know which is a better choice as a start. Thank you very much.

--
Like Us on FaceBook https://www.facebook.com/CakePHP
Find us on Twitter http://twitter.com/CakePHP
 
---
You received this message because you are subscribed to the Google Groups "CakePHP" group.
To unsubscribe from this group and stop receiving emails from it, send an email to cake-php+u...@googlegroups.com.
To post to this group, send email to cake...@googlegroups.com.
Visit this group at http://groups.google.com/group/cake-php?hl=en.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

--
Like Us on FaceBook https://www.facebook.com/CakePHP
Find us on Twitter http://twitter.com/CakePHP
 
---
You received this message because you are subscribed to the Google Groups "CakePHP" group.
To unsubscribe from this group and stop receiving emails from it, send an email to cake-php+unsubscribe@googlegroups.com.
To post to this group, send email to cake-php@googlegroups.com.
Visit this group at http://groups.google.com/group/cake-php?hl=en.
For more options, visit https://groups.google.com/groups/opt_out.
 
 

No comments: