CODEWITHSUNDEEP
phpcakephp
user1485472
user1485472

Reputation: 11

Cakephp Js helper

I am working with Js helper to help me replace the contents of a "div" in my index.ctp with contents of another file changeto.ctp .

This application has a few check boxes with corresponding images. When I select a checkbox, the setting is stored in the database and the corresponding image is to be displayed. Similarly when unchecked, it is to be removed from the database and the image should disappear.

I am using the Js helper for this :

my changeto.ctp is subset of my index.ctp and has access to same variables and loads without any problems (except that any click/change events are just not responded to. The names of the Ids of the checkboxes are exactly same).

My index file contains the following Js code at the bottom of all Html: 

$this->Js->get($change_checkbox1 )->event('click',
            $this->Js->request(array(
            'controller'=>'testing',
            'action'=>'changeto'
            ), array(
            'update'=>'#changeDiv',
            'async' => true,
            'method' => 'post',
            'dataExpression'=>true,
            'data'=> $this->Js->serializeForm(array(
                    'isForm' => false,
                    'inline' => true
                    ))
            ))

    );

This is generating the following Jquery/javascript 

     $(document).ready(function () {$("#ck0_1_8").bind("click", function (event)      {$.ajax({async:true, data:$("#ck0_1_8").closest("form").serialize(), dataType:"html", success:function (data, textStatus) {$("#changeDiv").html(data);}, type:"post",   url:"\/mytest-site\/options\/testing"});
        return false;});


}

My controller has a function called 

 changeto()
    {

     $this->layout = 'ajax';
    }

the first time I click on this the checkbox this works without any problem. However any subsequent clicks don't work. The javascript is not even being called.

My questions are :

Any ideas ? Will it help if I somehow ask cakephp to use on() / live() insead of bind() .If yes how ?

Thanks!!

Upvotes: 1

Views: 1143

Answers (2)

zot24
zot24

Reputation: 323

You have to use on instead of bind as they suggest in this question .live() vs .bind()

That's what I did was create my own Helper on View/Helper add the following method:

public function onEvent($selector, $type, $callback, $options = array()) {
    $defaults = array('wrap' => true, 'stop' => true);
    $options = array_merge($defaults, $options);
    $function = 'function (event) {%s}';

    if ($options['wrap'] && $options['stop']) {
        $callback .= "\nreturn false;";
    }

    if ($options['wrap']) {
        $callback = sprintf($function, $callback);
    }
    return sprintf('$(document).on("%s", "%s", %s);', $type, $selector, $callback);
}

And use that method from my views:

echo $this->MyJs->onEvent('#creditcards', 'change', $eventCode, array('stop' => false));

Upvotes: 0

Strewk
Strewk

Reputation: 31

Solved this by editing a cakephp core file:

lib/Cake/View/Helper/JqueryEngineHelper.php

line 184: change

return sprintf('%s.bind("%s", %s);', $this->selection, $type, $callback);

to

return sprintf('%s.live("%s", %s);', $this->selection, $type, $callback);

cake version 2.2.2

Upvotes: 3

Related Questions