Question

I want to rewrite this jQuery Ajax Request which is not working well with cakePHP with a code block in my cakePHP view using JsHelper.
So far, I’ve setup everything( included the helper in my controller, written the buffer in my Layout, included my library(jQuery) ), but I dont know how to rewrite this:

         $.ajax
            ({
                url: 'clients/loadJsonMarkers',
                accepts: 'json',
                type: 'POST',
                data: postData,
                dataType: 'json',
                error: function(xhr,status,err){
                    alert("DEBUG: status"+status+" \nError:"+err);
                },  
                success: function(transport)
                {   

                    var markers = new Array();

                    for(var i in transport.clients)
                    {
                        var latlng = transport.clients[i].Client.geoloc.replace("(", "");
                        latlng = latlng.replace(")", "");
                        latlng = latlng.split(',');

                        //console.debug(latlng);
                        markers.push(new google.maps.LatLng(parseFloat(latlng[0]),parseFloat(latlng[1])));
                    }

                    loadMap(markers);

                }
            });

What I’ve achieved to write so far was this:

    $this->Js->get('document');
    $this->Js->event('load',
            $this->Js->request(
                array('action' => 'loadJsonMarkers'),
                array('assync'=>TRUE, 'type'=>'json', 'method'=>'POST', 'data'=>$_POST)
                ),
            array('success'=>$this->Html->scriptBlock("
                    function(transport)
                    {   
                        var markers = new Array();

                        for(var i in transport.clients)
                        {
                            var latlng = transport.clients[i].Client.geoloc.replace('(', '');
                            latlng = latlng.replace('(', '');
                            latlng = latlng.split(',');

                            //console.debug(latlng);
                            markers.push(new google.maps.LatLng(parseFloat(latlng[0]),parseFloat(latlng[1])));
                        }

                        loadMap(markers);

                    }"
            ))
    );

But I feel like something is missing and I don’t know if I should use this selector(document).

Answer 1

Since Cake buffers everything and places it in a $(document).ready() function, all you should need to do is add it to the buffer.

$request = $this->Js->request(
  array('action' => 'loadJsonMarkers'),
  array(
    'async' => true, 
    'type' => 'json', 
    'method' => 'POST', 
    'data' => $_POST,
    'wrapCallbacks' => false,
    'success' => "function(transport) {
      var markers = new Array();

      for(var i in transport.clients) {
        var latlng = transport.clients[i].Client.geoloc.replace('(', '');
        latlng = latlng.replace('(', '');
        latlng = latlng.split(',');

        markers.push(new google.maps.LatLng(parseFloat(latlng[0]),parseFloat(latlng[1])));
      }
      loadMap(markers);
    }"
  )  
);
$this->Js->buffer($request);

Make sure you’re writing the buffer in your layout.

However, since you’ve already got the pure JS writting you should probably just buffer that, since the JsHelper will likely be removed in CakePHP 3.0.