GetScript Function Working But Doesn't Get Some Of The Css

So every time I am loading my getScript function on ajax success some of the js are working some of it are not. but if i'm loading trying to load it on my footer.php it's working.

Solution 1:

Maybe the following will work better, even though it's not documented the function getScript of jQuery returns a promise, you can use that. $.ajax returns a promise too so you can use that.

var base_url = window.location.origin;

if (window.location.pathname.split('/')[1] === 'music' ||
  window.location.pathname.split('/')[1] === 'musicsystem')
  base_url = base_url + '/' + window.location.pathname.split('/')[1];

const getScripts = 
  resources => {
    return jQuery.when.apply(
      null
      ,resources.map(
        resource =>
          $.getScript(base_url + resource)
        )
    )
;

}
$(document).ready(function() {
  $.ajax({
    //async: false,//are you kidding? async false is still a thing???? I assume you'd like someone to hire you at some point in time right?
    url: base_url + '/dashboard/index'
  })
  .then(
    data => {
      const scripts = [
        //are you sure you'd want to load all the scripts?
        //I'm pretty sure you don't need to load your libraries again
        //would be simpler to write a js function that will initialize
        //the new content that's on the page instead of this
        "/assets/bower_components/jquery/dist/jquery.min.js",
        "/assets/bower_components/bootstrap/dist/js/bootstrap.min.js",
        "/assets/bower_components/jquery-ui/jquery-ui.min.js",
        "/assets/bower_components/datatables.net/js/jquery.dataTables.min.js",
        "/assets/bower_components/datatables.net-bs/js/dataTables.bootstrap.min.js",
        "/assets/bower_components/jquery-sparkline/dist/jquery.sparkline.min.js",
        "/assets/plugins/jvectormap/jquery-jvectormap-1.2.2.min.js",
        "/assets/plugins/jvectormap/jquery-jvectormap-world-mill-en.js",
        "/assets/bower_components/jquery-knob/dist/jquery.knob.min.js",
        "/assets/bower_components/bootstrap-datepicker/dist/js/bootstrap-datepicker.min.js",
        "/assets/plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js",
        "/assets/bower_components/jquery-slimscroll/jquery.slimscroll.min.js",
        "/assets/bower_components/fastclick/lib/fastclick.js",
        "/assets/dist/js/adminlte.min.js",
        "/assets/dist/js/pages/dashboard.js",
        "/assets/plugins/iCheck/icheck.min.js",
        "/assets/dist/js/demo.js",
        "/assets/js/dataTables.colReorder.min.js",
        "/assets/dist/js/clipboard.js",
        "/assets/js/audio.min.js",
        "/assets/js/config.js",
        "/assets/js/dropzone.js",
        "/assets/js/howler.js",
        "/assets/js/upload.js",
        "/assets/js/player.js",
        "/assets/js/songdraganddrop.js",
        "/assets/js/pitching.js",
        "/assets/js/share.js",
        "/assets/js/alertify.js",
        "/assets/bower_components/select2/dist/js/select2.full.min.js",
        "/assets/js/newscript.js"
      ];
      $('#inside').html(data);//set the html before loading the scripts
      return getScripts(scripts)
      .then(x=>data);//return data after getscript is done
    }
  )
  .then(
    undefined
    ,err => console.warn("Failed:",err)//handle the error
  );        

});