How to include jquery in newly created app

[josefa123]

I have created a new app called sample using the splunk web. I made a simple JS file that look like this and uploaded it.

require(['jquery'], function($){
    $(window).load(function(){
        console.log("Lets try this one more time!")
    })
});

Jquery doesn't seem to run because I have tried removing the jquery codes and the console.log() run perfectly. How can I include different framework in my app? Thanks in advance

[jeffland · Accepted solution]

You don't need to do anything specific with jquery unless you want that functionality:

require([
    "jquery",
    "splunkjs/mvc/simplexml/ready!"], 
function($){
    console.log("Let's change something in the DOM...");
    $(".dashboard-header").find("h2").append('<h2>Hooray!</h2>');
});

[josefa123]

I need to add some library on my app so I am trying to include jquery for testing. can I ask why do I need splunkjs ready!? and why do you change $(window).load() to some other jquery code? I tried to use windows.load but it doesnt work. It is really weird.

also, if I want to use lodash.js how can I add it on splunk? Thanks

[jeffland]

The question is, why do you want to use $(window).load()? It does nothing you need to do.
The javascript code I gave you is all you need in your file to see how to use jquery on a dashboard, there is no need for anything more (unless you want to use further elements such as a searchmanager, which would als have to be required and placed in the function brackets). Requiring ready! signals splunk to work when the page is ready.

If you want to use lodash.js, you just place it in the same folder you placed your initital .js in (appname/appserver/static), add it to your Simple XML like this:

<form script="your_js.js, lodash.js">
    ...

and that's it. Remember to restart your splunk to pick up new files.