The JavaScript Code is not working for me. I want the token new_product_name to display the initial content of the dropdown product_name each time the page loads as well as anytime the dropdown is changed. Can anybody assist?
@anyioneta, your screenshots for Simple XML and Javascript seems to be off with the token name.
To initialize a token in Splunk Enterprise 6.5 onward you can use <init>
section in Simple XML. You would need set the new token value to both default
and submitted
token models. Please try out and confirm. Since this involves static JavaScript file make sure Splunk is refreshed/bumped/restarted after the changes to JavaScript file and also browser history is cleared if required.
Following is the Simple XML dashboard code:
<form script="myQNs.js">
<label>Dropdown Value Set using SplunkJS</label>
<init>
<set token="new_product_name">All Selected</set>
</init>
<fieldset submitButton="false">
<input type="dropdown" token="product_name" searchWhenChanged="true">
<label>Product Name</label>
<choice value="*">All</choice>
<choice value="Nokia">Nokia</choice>
<choice value="Samsung">Samsung</choice>
<choice value="Apple">Apple</choice>
<choice value="Dell">Dell</choice>
<initialValue>*</initialValue>
<default>*</default>
</input>
</fieldset>
<row>
<panel>
<html>
new_product_name="$new_product_name$"
</html>
</panel>
</row>
</form>
Following is the corresponding JavaScript myQNs.js
:
require([
"splunkjs/mvc",
"splunkjs/mvc/simplexml/ready!"
], function(
mvc
) {
var defaultTokenModel = mvc.Components.get("default");
var submittedTokenModel = mvc.Components.get("submitted");
defaultTokenModel.on("change:product_name", function(newValue) {
var new_product_name=defaultTokenModel.get("product_name");
switch(new_product_name){
case "*":
defaultTokenModel.set("new_product_name", "All Selected");
submittedTokenModel.set("new_product_name", "All Selected");
break;
default:
new_product_name=new_product_name+" Selected";
defaultTokenModel.set("new_product_name", new_product_name);
submittedTokenModel.set("new_product_name", new_product_name);
}
});
});
PS: In case your JavaScript does not seem to be working you should add alert()
and console.log()
statements in your JavaScript to debug the code behavior.
@anyioneta, your screenshots for Simple XML and Javascript seems to be off with the token name.
To initialize a token in Splunk Enterprise 6.5 onward you can use <init>
section in Simple XML. You would need set the new token value to both default
and submitted
token models. Please try out and confirm. Since this involves static JavaScript file make sure Splunk is refreshed/bumped/restarted after the changes to JavaScript file and also browser history is cleared if required.
Following is the Simple XML dashboard code:
<form script="myQNs.js">
<label>Dropdown Value Set using SplunkJS</label>
<init>
<set token="new_product_name">All Selected</set>
</init>
<fieldset submitButton="false">
<input type="dropdown" token="product_name" searchWhenChanged="true">
<label>Product Name</label>
<choice value="*">All</choice>
<choice value="Nokia">Nokia</choice>
<choice value="Samsung">Samsung</choice>
<choice value="Apple">Apple</choice>
<choice value="Dell">Dell</choice>
<initialValue>*</initialValue>
<default>*</default>
</input>
</fieldset>
<row>
<panel>
<html>
new_product_name="$new_product_name$"
</html>
</panel>
</row>
</form>
Following is the corresponding JavaScript myQNs.js
:
require([
"splunkjs/mvc",
"splunkjs/mvc/simplexml/ready!"
], function(
mvc
) {
var defaultTokenModel = mvc.Components.get("default");
var submittedTokenModel = mvc.Components.get("submitted");
defaultTokenModel.on("change:product_name", function(newValue) {
var new_product_name=defaultTokenModel.get("product_name");
switch(new_product_name){
case "*":
defaultTokenModel.set("new_product_name", "All Selected");
submittedTokenModel.set("new_product_name", "All Selected");
break;
default:
new_product_name=new_product_name+" Selected";
defaultTokenModel.set("new_product_name", new_product_name);
submittedTokenModel.set("new_product_name", new_product_name);
}
});
});
PS: In case your JavaScript does not seem to be working you should add alert()
and console.log()
statements in your JavaScript to debug the code behavior.
Hi @niketnilay,
when I select any value other than All
in dropdown and refresh the dashboard then it will give token as All selected
as here <init>
token gives this value...
Thanks bro
Hi @anyioneta,
Try this run anywhere search without use of js:
<form>
<label>Dropdown</label>
<fieldset submitButton="false">
<input type="dropdown" token="sourcetype" searchWhenChanged="true">
<label>MyQn</label>
<default>*</default>
<choice value="*">All</choice>
<choice value="Nokia">Nokia</choice>
<choice value="Samsung">Samsung</choice>
<choice value="Apple">Apple</choice>
<choice value="Del">Del</choice>
<change>
<condition label="All">
<set token="new_product_name">All selected</set>
</condition>
<condition label="Nokia">
<set token="new_product_name">Nokia</set>
</condition>
<condition label="Samsung">
<set token="new_product_name">Samsung</set>
</condition>
<condition label="Apple">
<set token="new_product_name">Apple</set>
</condition>
<condition label="Del">
<set token="new_product_name">Del</set>
</condition>
</change>
</input>
</fieldset>
<row>
<panel>
<title> token=$new_product_name$ </title>
<html></html>
</panel>
</row>
</form>
So in <change>
tag you add set required token value.
also add searchWhenChanged="true"
in input tag
Thanks, this works. But is there any way I can achieve this using Javascript?
yes, you can achieve this using js but it's better to use xml whenever possible..
Could you help me out with the .js code as well?
I tried this but it did not work.
defaultTokenModel.on("change:product_name document:ready", function() { //My code }
@niketnilay already provided js code