我的网站上有一个jqgrid(版本3.5.3),它是通过对Web服务的Ajax调用获取结果的。查询通常很复杂,加载结果需要花费几秒钟的时间。加载时,用户会看到一个框[Loading …]。
如果用户意识到他们在搜索错误的内容,则客户端要求向网格添加一个取消按钮,这将:
似乎没有内置任何功能,因此我可能正在寻找一些技巧来实现这一目标。
有任何想法吗?
这是我们的解决方案,与Oleg的解决方案非常相似,主要区别在于我们跟踪XHR列表以确保我们清理所有请求
var handlerUrl = ''; jQuery(document).ready(function() { var xhrList = []; var beforeSendHandler = function() { var cancelPendingRequests = function() { jQuery.each(xhrList, function() { this.abort(); }); xhrList = []; return false; }; var hideLoadingUI = function() { $(this).hide(); $("#load_list").hide(); }; cancelPendingRequests(); $("#load_list").show(); // some faffing around to ensure we only show one cancel button at a time if (jQuery("#cancelrequest").length == 0) { jQuery(".ui-jqgrid-titlebar").append(jQuery("<button id='cancelrequest'>Cancel</button>").click(cancelPendingRequests).click(hideLoadingUI)); } else { jQuery("#cancelrequest").show(); }; } jQuery("#list").jqGrid({ datatype: function(postdata) { GetSearchCriteria(); //needed for the grid's filtering var xhr = $.ajax({ //we override the beforeSend so we can get at the XHRs, but this means we have to implement the default behaviour, like showing the loading message ourselves beforeSend: beforeSendHandler, dataType: "xml", data: postdata, success: function(xmlDoc) { // jQuery("#cancelrequest").hide(); $("#load_list").hide(); jQuery("#list")[0].addXmlData(xmlDoc); xhrList = []; }
…