@avivn, Behavior of depends attribute and rejects attributes with multiple tokens are different.
For depends multiple tokens work like AND, i.e. element (like row, panel, html, input) with depends shows up only when all tokens are set. On the other hand, for rejects multiple tokens work like OR, i.e. element with rejects gets hidden even if there is one token which is unset.
So instead of using rejects, you would need to implement your own logic using Simple XML JavaScript Extension in your dashboard.
PS: Since the following required Token Handler, you need to know whether tokens belong to default or submitted model in your dashboard/form. Refer to documentation: http://dev.splunk.com/view/SP-CAAAEW2.
I have used default event handler in my case to code change in token values. Since I have used token's change event handler, assumption is both tokens will not be set on dashboard/form load. : http://dev.splunk.com/view/webframework-codeexamples/SP-CAAAE5J
Step 1: Save the following file as hide_html_on_multiple_tokens.js
require([
"splunkjs/mvc",
"jquery"
],
function(
mvc,
$
) {
//mvc.Components.get() function to get all default Tokens
var defaultTokenModel = mvc.Components.get("default");
defaultTokenModel.on("change:first",function(newTokFirst,first){
console.log("first: ",first);
var tokSecond= defaultTokenModel.get("second");
console.log("tokSecond: ",tokSecond);
if (tokSecond===undefined || first===undefined){
$("#html1").show();
}else{
$("#html1").hide();
}
});
defaultTokenModel.on("change:second",function(newTokSecond,second){
console.log("second: ",second);
var tokFirst= defaultTokenModel.get("first");
console.log("tokFirst: ",tokFirst);
if (tokFirst===undefined || second===undefined){
$("#html1").show();
}else{
$("#html1").hide();
}
});
}
);
Step 2: Create a SimpleXML form with above JS and radio input to set and unset two tokens to test whether HTML panel gets hidden or not. PS: jQuery in this example uses HTML id attribute i.e. html1 to hide() or show()the same:
<form script="hide_html_on_multiple_tokens.js">
<label>Hide HTML Panel on setting both first and second tokens</label>
<fieldset submitButton="false">
<input type="radio" token="tokenChanges">
<label></label>
<choice value="setfirst">Set First Token</choice>
<choice value="unsetfirst">Unset First Token</choice>
<choice value="setsecond">Set Second Token</choice>
<choice value="unsetsecond">Unset Second Token</choice>
<choice value="setboth">Set Both Tokens</choice>
<choice value="unsetboth">Unset Both Tokens</choice>
<change>
<condition value="setfirst">
<set token="first">true</set>
</condition>
<condition value="unsetfirst">
<unset token="first"></unset>
</condition>
<condition value="setsecond">
<set token="second">true</set>
</condition>
<condition value="unsetsecond">
<unset token="second"></unset>
</condition>
<condition value="setboth">
<set token="first">true</set>
<set token="second">true</set>
</condition>
<condition value="unsetboth">
<unset token="first"></unset>
<unset token="second"></unset>
</condition>
</change>
</input>
</fieldset>
<row>
<panel>
<title>Chart 1 (HTML section hides only when both first: $first$ and second: $second$ tokens are set)</title>
<html id="html1">
<div style="color:red;text-align:center;font-weight:bold;font-size:200%">token1: $first$ - token2: $second$</div>
</html>
</panel>
</row>
</form>
@avivn, Behavior of depends attribute and rejects attributes with multiple tokens are different.
For depends multiple tokens work like AND, i.e. element (like row, panel, html, input) with depends shows up only when all tokens are set. On the other hand, for rejects multiple tokens work like OR, i.e. element with rejects gets hidden even if there is one token which is unset.
So instead of using rejects, you would need to implement your own logic using Simple XML JavaScript Extension in your dashboard.
PS: Since the following required Token Handler, you need to know whether tokens belong to default or submitted model in your dashboard/form. Refer to documentation: http://dev.splunk.com/view/SP-CAAAEW2.
I have used default event handler in my case to code change in token values. Since I have used token's change event handler, assumption is both tokens will not be set on dashboard/form load. : http://dev.splunk.com/view/webframework-codeexamples/SP-CAAAE5J
Step 1: Save the following file as hide_html_on_multiple_tokens.js
require([
"splunkjs/mvc",
"jquery"
],
function(
mvc,
$
) {
//mvc.Components.get() function to get all default Tokens
var defaultTokenModel = mvc.Components.get("default");
defaultTokenModel.on("change:first",function(newTokFirst,first){
console.log("first: ",first);
var tokSecond= defaultTokenModel.get("second");
console.log("tokSecond: ",tokSecond);
if (tokSecond===undefined || first===undefined){
$("#html1").show();
}else{
$("#html1").hide();
}
});
defaultTokenModel.on("change:second",function(newTokSecond,second){
console.log("second: ",second);
var tokFirst= defaultTokenModel.get("first");
console.log("tokFirst: ",tokFirst);
if (tokFirst===undefined || second===undefined){
$("#html1").show();
}else{
$("#html1").hide();
}
});
}
);
Step 2: Create a SimpleXML form with above JS and radio input to set and unset two tokens to test whether HTML panel gets hidden or not. PS: jQuery in this example uses HTML id attribute i.e. html1 to hide() or show()the same:
<form script="hide_html_on_multiple_tokens.js">
<label>Hide HTML Panel on setting both first and second tokens</label>
<fieldset submitButton="false">
<input type="radio" token="tokenChanges">
<label></label>
<choice value="setfirst">Set First Token</choice>
<choice value="unsetfirst">Unset First Token</choice>
<choice value="setsecond">Set Second Token</choice>
<choice value="unsetsecond">Unset Second Token</choice>
<choice value="setboth">Set Both Tokens</choice>
<choice value="unsetboth">Unset Both Tokens</choice>
<change>
<condition value="setfirst">
<set token="first">true</set>
</condition>
<condition value="unsetfirst">
<unset token="first"></unset>
</condition>
<condition value="setsecond">
<set token="second">true</set>
</condition>
<condition value="unsetsecond">
<unset token="second"></unset>
</condition>
<condition value="setboth">
<set token="first">true</set>
<set token="second">true</set>
</condition>
<condition value="unsetboth">
<unset token="first"></unset>
<unset token="second"></unset>
</condition>
</change>
</input>
</fieldset>
<row>
<panel>
<title>Chart 1 (HTML section hides only when both first: $first$ and second: $second$ tokens are set)</title>
<html id="html1">
<div style="color:red;text-align:center;font-weight:bold;font-size:200%">token1: $first$ - token2: $second$</div>
</html>
</panel>
</row>
</form>
