Cgridview Ajax Update

Yii 1.1 General Discussion
1

Dear everybody,

I have a Cgridview table, and I want to add a field to search (an input tag). When have a event ‘keyup’ on this field, the ajax update($.fn.yiiGridView.update) is called.

My problem is: when have many ajax update, some was finished not in order when call ajax, so the grid content was wrong.

And I want if an ajax was called first, the result of this call was updated first, and some ajax was called later will wait after this update was finished (like search in edatatable extension)!

please help me solve this problem! thanks you!

2

Might be this link will be helpful for you check

3

Thanks you for reply!

But my problem is different!

in my page, I add one input tag in the above of cgridview to search for all!

$('body').undelegate('.search_content','keyup').delegate('.search_content','keyup',


    $.fn.yiiGridView.update('cargo-grid',{data:$(this).val()});


});

And if there are 3 ajax update 1,2,3. And the third ajax finish first and it will update the Cgridview first.

I want the cgridview will update in order 1,2,3. If the third finish first, it have to wait the 1 and 2 update first.

Please help!

4

Hi hqnhat,

This is not a straight answer, but I think you may consider using a delay for triggering ajax.




var delay = (function(){

	var timer = 0;

	return function(callback, ms){

		clearTimeout(timer);

		timer = setTimeout(callback, ms);

	};

})();

$('.search_content').on('keyup', function(event){

	delay(function(){

		$.fn.yiiGridView.update('cargo-grid',{data:$(this).val()});

	}, 500); // 500 ms delay

	event.preventDefault();

});
5

Abort all previous request, because i need lastest result. Try this:

$.xhrPool = []; // array of uncompleted requests

$.xhrPool.abortAll = function() { // our abort function

$(this).each(function(idx, jqXHR) { 


    jqXHR.abort();


});


$.xhrPool.length = 0

};

$.ajaxSetup({

beforeSend: function(jqXHR) { // before jQuery send the request we will push it to our array


    $.xhrPool.push(jqXHR);


},


complete: function(jqXHR) { // when some of the requests completed it will splice from the array


    var index = $.xhrPool.indexOf(jqXHR);


    if (index > -1) {


        $.xhrPool.splice(index, 1);


    }


}

});

$(‘body’).undelegate(’.search_content’,‘keyup’).delegate(’.search_content’,‘keyup’,function(){

[b]$.xhrPool.abortAll();[/b]


$.fn.yiiGridView.update('cargo-grid',{data:$(this).val()});

});

6

Thanks you, softark, But I think this is not best solution!

It’s great and I did it! Thanks you very much, oxigen