问题
I cannot find any examples of how to lazy load the Infragistics UltraWebTree v6.3
I found that the docs on the Infragistics site tend to be limited to the latest version of their controls, but this is a legacy app which I am unable to upgrade. Has anyone got example code or links which demonstrate how to lazy-load nodes in this control?
The current implementation that we have loads 1.35MB of html because it is populating the entire tree!! Yikes!
回答1:
It turnedout to be a simple piece of JQuery and a webservice to return the rendered nodes.
Any node that has sub-items is initialised with the text "Loading..." so that the script knows to attempt to retrieve them.
<script type="text/javascript" language="javascript">
var imageTypeExpression = "img[imgType='exp'][src$='plus.gif']";
var maxRetries = 5;
jQuery(document).ready(function() {
jQuery("#T_TreeListCtl " + imageTypeExpression).click(imageClick);
jQuery("#tdLists").show();
});
function imageClick() {
var parentDivId = jQuery(this).parent().attr('id');
var nodesDiv = '#M_' + parentDivId;
if (jQuery(nodesDiv).text() == 'Loading...') {
getNodes(parentDivId, nodesDiv, maxRetries);
}
}
function getNodes(parentDivId, nodesDiv, retryCount){
if (retryCount == 0) {
jQuery(nodesDiv).html("<div>Loading... failed.</div>");
}
else {
jQuery.ajax({ type: "POST",
url: "WebServices/TreeNodes.asmx/GetChildNodes",
data: "{'parentId' :'" + parentDivId + "'}",
dataType: "json",
contentType: 'application/json; charset=utf-8',
success: function(json) {
var result = eval("(" + json.d + ")");
jQuery(nodesDiv).html(result.value);
jQuery(imageTypeExpression, nodesDiv).click(imageClick);
},
timeout: 100,
error: function(XMLHttpRequest, textStatus, errorThrown) {
if (textStatus == 'timeout') {
getNodes(parentDivId, nodesDiv, retryCount - 1); //keep trying
}
}
});
}
}
</script>
来源:https://stackoverflow.com/questions/3333324/how-to-lazy-load-infragistics-ultrawebtree-control