Javascript Wont Work After Loading Data With Renderpatial With Ajax

Hi All,

I have a problem with renderPartial here. my scenario is, on page I have bootstrap tabs, in the tabs i am loading data from ajax request which response is rendered from a render partial call from controller. every thing is looks fine till here.

In ajax response either a listview or gridview is being loaded on the page. In that grid I used chtml link with chtml ajax onclick event to load data inside grid row. foe example i have inbox grid and onclick of message title I am appending details of message inside the row Html.

once the details of any message appended the delete button in the grid stop working and on click its javascript associated event wont work and its redirect as a normal link.

$this->renderPartial(Yum::module(‘message’)->inboxView, array(‘model’=> $model), false, true);

the above I used to load data under a tab

$this->renderPartial(‘view’,array(‘model’=>$model), false, true);

the above I used to load data to append message in the row html

if I do renderPartail with (true, false) then the reply and send buttons stop working attached with the message details.

Please see the image grab for an idea what I am described above.

Any reply will be appreciated a lot. Please let me know if above is not cleared enough

Hi,

Is it a traditional javascript or a jQuery?

You need to reinitialize the javascript functions.

This isn’t Yii related but rather javascript only related.

It’s because the elements and events brought in the page via ajax are not bound to the current document.

Basically when the page finishes loading that’s the entire DOM your javascript knows about and if you need to bind to elements that will be later brought in page via ajax, you need a ‘live’ binding, an event handler that listens for all your page changes for various elements.

That’s why jquery has had the live() function and now it has the $(document).on(‘click’, ‘#element’, function(){});

It’s the default delete button of gridview that lost his javascript, how I can reinitialize it?? or how I set it with .live or body??