Need Advice On Update Of Cgridview In Ajax Call

Setup is as follows:

I render ajaxbased tabs (one for each day of the week).

Each tab contains 1 gridview and multiple cjuisortable objects.

The gridview contains entries that can be put into one of the cjuisortable objects.

Each sortable line contains an ajaxlink that can update or delete the entry (and return it to the gridview).

When I delete an entry from the cjuisortable, the contents of the cjuisortable is refreshed (entry is removed) and the cgridview receives an update (and gets the entry back).

The problem is, that the update on the gridview destroys the cjuisortable sortable part (you cannot sort the entries anymore).

Tracing the problem shows, that when the ajax function gets called to delete the entry, the update of the gridview causes another ajax call to the one delivering the content of the tab, causing the sortable to lose its identity.

Thanks for your help!

How can I prevent (or rewrite) the cgridview to do an update on its contents without invoking the ajaxcall that delivers content to the tab? Or some other workaround to get the div containing the gridview to refresh its contents?

“success”=>‘js:function(msg){$("#sortable_day1_content3").html(msg);$("#day1grid").yiiGridView(“update”)}’,

"day1grid" refers to the gridview of that day

sortable_day1_content3 refers to the third cjuisortable object of that day that invoked the delete action.

Hi Pandoras,

You can use "afterAjaxUpdate" property of the CGridView to make the rows sortable again.

http://www.yiiframework.com/wiki/238/creating-a-jqueryui-sortable-cgridview#c6585

Thanks for the reply, but I don’t know if this is the same. The CJuisortables are not part of the gridview… they are separate entities.

After more trial and mostly error, the thing I don’t get is this:

I have a refresh button that basically updates the gridview and all sortable objects below it… After pressing this button, the sortables still work, but if I use the same function on the partial responsible for the contents of each day’s tab, it doesn’t work.

Guess I’ll have to stop reloading the page and directly update the data of the sortable instead of reloading it…

I managed to fix it by not using the yii widget during the update. Now I just invoke an unordered list and at the end of the ajax call, I’ll turn it into a sortable. Now the function works as expected. Yay!

Oh, the headaches! The sortable finally works, but now the response button/text when a list has been changed doesn’t work anymore.

<div sortables>

<div sortablecontent A>

sortable A

</div>

<div message sortable A></div>

<div sortablecontent B>

sortable B

</div>

<div message sortable B></div>

</div>

If I trigger the update on say sortablecontent A and reactivate sortable A (with onchange event try put a message in message sortable A), it works fine.

If I trigger the update on all sortables (reload contents of sortables) and reactivate all sortable objects, whenever I change the order of A or B, it will always activate the message in message sortable B.

Update: fixed as well… forgot a stupid ‘var’ in front of the javascript… At least posting in here makes the code work :wink: