Show loading panel until form load all combo data

Hi,

My form has the validation that combo fields cannot be empty.And the problem is validation error show when the user click the save button before form load all the combo data. Below is my detail code.

As you can see, I tried to add loading panel when I load the form data which is inside reloadDataToShow() method and hide it inside getDataSuccess() method. But this does not fix the problem because even after it hit the dhtmlx.modalbox.hide(box) statement , some of the combos are still loading. I also tried to add inside OnXLE event for cboDesign. But the loading panel hide only after finish loading data for that combo. Other combos are still loading. So, how can I show loading panel until all combo finish loading data?

Thank you.

I know this post is 5 months old, so it may not still be an issue, but I thought I’d post a solution for anyone else wanting to do the same thing.

I did a similar thing when loading multiple large Data Stores on a page. What I did was to have a function that ran on XLS that would add the name of the data store into a global object as a key and true for the value, check if the loading window was already showing, and show it if it wasn’t already. Then on XLE another function would indicate the Data Store was done loading by setting its , check to see if any members of the array were still loading, and then hide the loading window if they all came back false.

This is the code I last used (I’ve changed how I was doing things, so it may not be up to date and totally functional, but should give an idea of how it worked):

[code]/*
Function: dataLoadingWindow_start
Parameters:
name | string | Name of the DHTMLX component that is starting the data loading process
Returns: Nothing
*/
function dataLoadingWindow_add(name){
// Initialize global variables
if (typeof window.compLoading !== “object”) { window.compLoading = []; }

window.compLoading[name] = true;	// add or update entry for DataSource in loading status array to indicate loading is in process
if (!dhxWins.isWindow("winDataLoading")) {	// create loading message window if not already showing
	dhxWins.createWindow({
		id:			"winDataLoading",
		width:		"400",
		height:		"200",
		center:		true,
		modal:		true,
		caption:	"Loading Data...",
		header:		false
	});
	dhxWins.window("winDataLoading").attachHTMLString("<div style='display:table;height:100%;width:100%;'><div style='display:table-cell;text-align:center;vertical-align:middle;font-size:28px;'>Loading page data, please wait...</div></div>");
}

}

/*
Function: dataLoadingWindow_end
Parameters:
name | string | Name of the DHTMLX component that is starting the data loading process
Returns: Nothing
*/
function dataLoadingWindow_end(name){
if (typeof window.compLoading === “object”){ // make sure loading status array exists
window.compLoading[name] = false; // update entry for DataSource in loading status array to indicate loading is finished

	var allFinished = true;
	for (var component in window.compLoading) {	// check all component entries in loading status array
		if (window.compLoading.hasOwnProperty(component)) {
			var status = compLoading[component];
			if (status === true) { allFinished = false; }	// there is a component still loading, do not close window
		}
	}
	if (allFinished) {
		if (dhxWins.isWindow("winDataLoading")) { dhxWins.window("winDataLoading").close(); }	// close window if no DataStores are still loading
	}
}

}[/code]