I actually solved this in a very hacky way. Basically I wait until splunk is ready, then I use a jquery getScript() to pull in the external scripts.
Now, if you look closely you'll notice they are nested. This is because there's AJAX taking place, and I need to wait for everything to come back before I can start using it. Nesting the functions() solves this.
Although it works, this is definitely not the best approach. Requirejs (like ineeman mentioned above) seems a lot cleaner.
<script>
require(["splunkjs/ready!"], function(mvc) {
//get the scripts using jquery
$.getScript( "/dj/static/josh_app/jqGrid/js/i18n/grid.locale-en.js", function( data, textStatus, jqxhr ) {
console.log( "grid.locale-en.js load was performed." );
$.getScript( "/dj/static/josh_app/jqGrid/js/jquery.jqGrid.min.js", function( data, textStatus, jqxhr ) {
console.log( "jquery.jqGrid.min.js load was performed." );
console.log("about to access the grid");
//the rest of this is all jqGrid stuff
jQuery("#list2").jqGrid({
url:'http://172.16.127.128:8000/dj/en-us/josh_app/ajax-request',
datatype: "json",
colNames:['ID','User', 'Date', 'Profile Name','Low Warn','Low Error','High Warn','High Error'],
colModel:[
{name:'id',index:'id'},
{name:'userid',index:'userid'},
{name:'date',index:'date'},
{name:'profile_name',index:'profile_name'},
{name:'low_warn',index:'low_warn'},
{name:'low_error',index:'low_error'},
{name:'high_warn',index:'high_warn'},
{name:'high_error',index:'high_error'}
],
rowNum:10,
rowList:[10,25,50],
pager: '#pager2',
sortname: 'id',
viewrecords: true,
sortorder: "desc",
caption:"Threshold Profiles"
});
jQuery("#list2").jqGrid('navGrid','#pager2',{edit:false,add:false,del:false});
});
});
});
</script>
... View more