Question

I have this problem where the UI components of my page like the drop down menus arent available until thirdparty scripts finish loading. This causes a problem because who knows whats going on on those servers. I need to detach the availability of the page’s interactive components from the loading of thirdparty stuff…

how?

=/

Answer 1

Try something like this:

<script type="text/javascript">
window.onload = function() {
  var scripts = [ '3rdparty1url','3rdparty2url','3rdparty3url',etc...];
  var head = document.getElementsByTagName('head')[0];
  for(var i = 0; i < scripts.length; ++i) {
    var scriptTag = document.createElement('script');
    scriptTag.src = scripts[i];
    head.appendChild(scriptTag);
  }
}
</script>

This will load in your external script files after the page has finished loading in the client’s browser. Your form UI elements should all be available.

If you’re using jQuery, you can do this:

<script type="text/javascript">
jQuery(function($){
    var scripts = [ '3rdparty1url','3rdparty2url','3rdparty3url',etc...];
    $.each(scripts, function(i,scrurl) {
      $('head').append($('<script>', { src: scrurl }));
    }
});
</script>