timing of onLoad verses Database driven select

[kswisher]

I am having a weird issue where some JS is working fine in Chrome, but is not working for IE 11.

The only thing I can speculate is that it has to do with the event timing. If I am running some code in an onLoad event for a page, which is setting the value for a database driven select, do I need some sort of delay in that? It looks like those are AJAX calls for the select boxes.

[Scott Klement]

Under the covers, Profound UI will launch AJAX calls (these are asynchronous, running in the background) for the database-driven widgets when it renders the display. It does not wait for these calls to finish before running onload.

So it's possible that the database-driven widgets will be loaded when the onload event runs, but it's also possible (and more likely) that the database-driven widgets will not be finished loading when the onload event is fired.

If you change the parameters during onload, this could cause it to run a new AJAX request. Then you run the risk of another timing error -- if the initial AJAX request (that ran before onload) takes longer to complete than the new one (initiated during onload) then you may end up with the initial one being the one the user sees instead of the one from onload.

It'd be best if you can find a way to set the properties at the outset so that changes during onload aren't needed, possibly using the "script:" prefix in the property to have it run your JS code that sets things up -- is that possible? That way, it only has to make one request.

[kswisher]

I am just getting back to try and resolve this issue.

I am not changing the value of the selection criteria, or any actual parameter of the select box. The weird interface has 2 separate dropdowns on different tabs that are always kept in sync via JS. If you change the value on one, it updates the other.

My latest attempt to work around this was to try and delay the sync process a bit, but that executes immediately it appears even with a 12 second delay.

In my record format onLoad parameter I am calling a function...which just delays the others functions but this doesn't work either. I am doing some console.log in there to try and debug and it is executing immediately.

Code: Select all

_$TRKM212R.delayedOnLoad_Used = function(){
	// delayed with window timer to fix issue with dropdowns not loading
	_$TRKM212R.syncLocalGridToLines();
	//_$TRKM212R.syncWarrantyGridToLines_Used();
	//_$TRKM212R.showOrHideLines();
	setTimeout(_$TRKM212R.syncWarrantyGridToLines_Used(),12000);
	setTimeout(_$TRKM212R.showOrHideLines(),12100);
};

[kswisher]

disregard....i didn't think i needed to wrap another anonymous function in the code if I already had a named function, but i tried that and it now works.

Code: Select all

_$TRKM212R.delayedOnLoad_Used = function(){
	// delayed with window timer to fix issue with dropdowns not loading
	_$TRKM212R.syncLocalGridToLines();
	//_$TRKM212R.syncWarrantyGridToLines_Used();
	//_$TRKM212R.showOrHideLines();
	setTimeout(function(){_$TRKM212R.syncWarrantyGridToLines_Used();},12000);
	setTimeout(function(){_$TRKM212R.showOrHideLines();},12100);
};

[Scott Klement]

That works.

Or you could remove the () to cause the functions to be called after the delay:

Code: Select all

   setTimeout(_$TRKM212R.syncWarrantyGridToLines_Used,12000);
   setTimeout(_$TRKM212R.showOrHideLines,12100);

The way you orginally posted it, it will call the functions immediately, but pass the output of the functions (their return value) to setTimeout. Removing the () means to call the actual function on the timeout.