CHtml called by Ajax not passing Javascript

Yii 1.1 General Discussion
1

Hi Guys,

I have an issue with some ajax calls and was hoping for some help with this.

To save pasting huge chunks of code I have a quick example that can be tested to show the issue I am referring to. The issue as shown by the snippets below is as follows. I have a button on the page, Button A. When I click button A and ajax call is made and the returned data, another ajax button, this one called Button B is placed onto the page.

When clicking Button B, I expect it to make another ajax call and alert the respnse. In this case I would expect it to alert "Successful". However, the first ajax call works, but the second does not as it seems the javascript success function etc is not passed for the second button.

Here is the view code:




<?php


echo CHtml::ajaxSubmitButton('Button-A',CHtml::normalizeUrl(array('/Accounts/testAjax')),array('success'=>'function(data)

                                                                                                {

                                                                                                    $("#button-test").html(data);

                                                                                                }',

                                                                                                'type'=>'POST'),

                                                                                                array('id'=>'button-a'));





?>

<div id="button-test"></div>

Here is the controller code:




public function actiontestAjax()

{

	echo CHtml::ajaxSubmitButton('Button-B',CHtml::normalizeUrl(array('/Accounts/testAjax2')),array('success'=>'function(data)

                                                                                                {

                                                                                                    alert(data);

                                                                                                }',

                                                                                                'type'=>'POST'),

                                                                                                array('id'=>'button-b'));


}


public function actiontestAjax2()

{

	echo successful;

}

Any help or advice would be appreciated.

2

[b]

UPDATE

[/b]

Finally found the answer for this after searching every variation that I could think of. The issue seems to be explained here:

https://code.google.com/p/yii/issues/detail?id=38

Specifically this paragraph:

[i]Issues are also found in widget classes. We need a better solution.

The cause of this issue is that js in "ready" function is called before the ajax

"update/replace" is performed. Therefore, the expected onclick and other event

handlers are not hooked to the corresponding HTML elements generated by ajax "update/replace".

A possible solution to this problem is that we wrap those js inside a function and

register this function to "ready". For ajax "update/replace", we explicitly call this

function. A potential problem is that an onclick handler might be registered multiple

times.

.[/i]

The page offers a few solutions, but in short, the solution is to use


renderPartial

like so:


$this->renderPartial('wdcalendar.views.default.engineer_files.render_form',array('model'=>$event),false,true);

Place the code necessary into the view page and then echo


renderPartial

in the controller and then using the ajax success we can replace the html with the new rendered content.

The false, true at the end is especially important in this circumstance.