event trigger for after page load AND ALL CASCADING FIELDS FINISHED UPDATING

[gsgriffin]

Not finding what I need.  I need to wait for form datapage to finish loading all of the cascading text fields before running the script.  I have a lot of cascading fields, so I cannot simply rely upon a trigger to fire onchange for the cascading field.  Does Caspio have any event trigger that can confirm all loads are finished for all cascading fields?  When loading, it should know how many fields are async getting information and it is waiting for a reply to update those fields.  Would be great to have an event listener that can tell me ALL CASCADING FIELDS ARE DONE UPDATING. 

FYI...DataPageReady listener DOES NOT wait for cascading fields.  It fires as soon as the initial HTML is loaded.  Cascading is async and can be completed several seconds (or more) as the page is "fully loaded".

Please do not suggest a timer to wait for a few seconds.  That doesn't work well, is poor programming, doesn't take into consideration different processor, browser, and internet access speeds and can cause people to wait for 10 second for a page load....the worst! I believe this will have to be a Caspio event listener.  Just can't find it in docs.

[George43]

You can add Event listener to the last cascading element.  The event should on change or value not null. this event listener should in Data Page Ready inside.

 

For Example

<script type="text/javascript">
document.addEventListener('DataPageReady', function (event) {
  	if(document.querySelector("#Value3_1_5021039762ca9d"){
           document.querySelector("#Value3_1_5021039762ca9d").addEventListener("change", function(){
          		if(document.querySelector("#Value3_1_5021039762ca9d").innerText!="No options Avaliable"){
                  	//do something
      			 }		
        	});
        }
       
});
</script>

 

[gsgriffin]

For clarification....code should execute immediately after the page is completely done loading and all cascading fields have finished the initial loading.  My case scenario is a page that receives an external value that is passed to a hidden virtual field.  That hidden virtual field is the cascading dependency that many other cascading fields are waiting to change upon.  They are all hidden, but provide the values I need for my script to act upon.  I need to wait for all of the cascading fields to have completely loaded and then begin execution.  There are a lot of variables in download speeds, that I have experienced, that can change the time it takes. 

It could be me, but the cascading fields don't always seem to update in order.  Don't know if there are variables in connection speed or size of the request and database speed.  Everything is always sequential?

Especially when you have cascading drop-downs and different lengths and lots of them.  I was hoping that there might be a Caspio event trigger that might be made available to tell us that there is no more loading of anything at the initial page load.  I do realize that cascading can change and force a change to a field later, but the initial load, initial cascade completion is what I'm looking for.

Your code is fine if there is a guaranteed change on load.  If there is no cascading change, then it is not going to trigger.

[gsgriffin]

I have many cascading and non-cascading dropdowns in a form.  I would like to execute a script once each and every dropdown is DONE loading.  The script I was to attach to all types of dropdowns will be triggered by CHANGE.  If I attach this before the cascading is complete, the new script will be executing each time a cascading option is added to the dropdown.  I only want the new script to execute AFTER all OPTIONS for the dropdown have been loaded....cascading or not.

As I test this, I have my script currently inside

document.addEventListener('DataPageReady', function (event) {

which should only execute after the page is ready.  However, it appears to execute before all of the cascading fields have finished.  I'm hoping that I don't have to attach a custom event listener for each and every dropdown but rather there is a way to have an evenlistener from Caspio that is when the page is REALLY ALL COMPLETELY DONE AND READY.

Does this exist?

[TellMeWhy]

I'm not entirely sure how DataPageReady works, but, I guess content is not waited, just literally the page is waited to load.

Instead of DataPageReady, have you tried 'load' instead?

Here's more information about this action: https://javascript.info/onload-ondomcontentloaded

[gsgriffin]

There was never a good solution to this, but I finally came up with this...in case someone else needs to run scripts making sure all cascading fields are loaded.

I tend to have a default value in dropdowns and will always have at least one other option available.  If you have cascading that may not have an additional value loaded, this may get stuck.

 

RUN WITH jQUERY....

var notDone;

function saveValue(){
  
   notDone=false;
   $('select[name^="EditRecord"]').each(function(){
    if($(this).children('option').length<2);//This count works so long as you have 2 or more options always
     notDone=true;
    }else{
     var currentVal=$(this).val();
     if(typeof $(this).val()!="undefined" && $(this).children('option[value="'+currentVal+'"]').length==0) {
      console.log("No option yet:"+currentVal);
      notDone=true;
      } 
    }
   });
 
  if(notDone){
   console.log("Not done!!! waiting");
   setTimeout(saveValue,500);//can decrease the time if you want it to check more frequently
   return false;
  }
 console.log("All options loaded");
                                             
...........your waiting scripts here
}

 

[AveEd]

On 3/25/2021 at 8:29 AM, gsgriffin said:

There was never a good solution to this, but I finally came up with this...in case someone else needs to run scripts making sure all cascading fields are loaded.

I tend to have a default value in dropdowns and will always have at least one other option available.  If you have cascading that may not have an additional value loaded, this may get stuck.

 

RUN WITH jQUERY....

var notDone;

function saveValue(){
  
   notDone=false;
   $('select[name^="EditRecord"]').each(function(){
    if($(this).children('option').length<2);//This count works so long as you have 2 or more options always
     notDone=true;
    }else{
     var currentVal=$(this).val();
     if(typeof $(this).val()!="undefined" && $(this).children('option[value="'+currentVal+'"]').length==0) {
      console.log("No option yet:"+currentVal);
      notDone=true;
      } 
    }
   });
 
  if(notDone){
   console.log("Not done!!! waiting");
   setTimeout(saveValue,500);//can decrease the time if you want it to check more frequently
   return false;
  }
 console.log("All options loaded");
                                             
...........your waiting scripts here
}

 

please elaborate on this!!

need for codes to run after calculated fields and/or lookup

This is very much needed.

 

[AveEd]

Wow! I have been having a hard time with this for weeks now. PLEASE HELP! Can you provide a full script and where to place? PLEASE!