I'm creating a Dashboard where i have multiple tabs(link list input) and i've multiple text input field
now i do not want all text field to appear in all the tabs.
for example I've 6 input field
"username"
"hostname"
"source_IP"
"destination_IP"
"emailID"
"user identity"
and I've 4-5 tabs
now in the first tab I want to see only username and hostname input type
in the 2nd tab I want to see source IP and destination IP field
and in the 3rd field I want to see user identity ,username and hostname field.
how can I achieve this, I'm not able to use multiple depends="token name" command in the in input text field tag
<form>
<label>Tabbed dashboard with depends</label>
<fieldset submitButton="false">
<input type="text" token="username" id="username" depends="$showusername$">
<label>username</label>
</input>
<input type="text" token="hostname" id="hostname" depends="$showhostname$">
<label>hostname</label>
</input>
<input type="text" token="source_IP" id="source_IP" depends="$showsource_IP$">
<label>source_IP</label>
</input>
<input type="text" token="destination_IP" id="destination_IP" depends="$showdestination_IP$">
<label>destination_IP</label>
</input>
<input type="text" token="emailID" id="emailID" depends="$showemailID$">
<label>emailID</label>
</input>
<input type="text" token="useridentity" id="useridentity" depends="$showuseridentity$">
<label>user identity</label>
</input>
<input type="link" token="tab_type" searchWhenChanged="true" id="tab_tab1">
<label>Type of tab</label>
<choice value="tab_type1">Tab1</choice>
<choice value="tab_type2">Tab2</choice>
<choice value="tab_type3">Tab3</choice>
<choice value="tab_type4">Tab4</choice>
<change>
<condition value="tab_type1">
<unset token="home_token"></unset>
<set token="tab_type1_token"></set>
<unset token="tab_type2_token"></unset>
<unset token="tab_type3_token"></unset>
<unset token="tab_type4_token"></unset>
<set token="showusername">k</set>
<set token="showhostname"></set>
<unset token="showsource_IP"></unset>
<unset token="showdestination_IP"></unset>
<unset token="showemailID"></unset>
<unset token="showuseridentity"></unset>
</condition>
<condition value="tab_type2">
<unset token="home_token"></unset>
<unset token="tab_type1_token"></unset>
<set token="tab_type2_token"></set>
<unset token="tab_type3_token"></unset>
<unset token="tab_type4_token"></unset>
<unset token="showusername"></unset>
<unset token="showhostname"></unset>
<set token="showsource_IP"></set>
<set token="showdestination_IP"></set>
<unset token="showemailID"></unset>
<unset token="showuseridentity"></unset>
</condition>
<condition value="tab_type3">
<unset token="home_token"></unset>
<unset token="tab_type1_token"></unset>
<unset token="tab_type2_token"></unset>
<set token="tab_type3_token"></set>
<unset token="tab_type4_token"></unset>
<set token="showusername"></set>
<set token="showhostname"></set>
<unset token="showsource_IP"></unset>
<unset token="showdestination_IP"></unset>
<unset token="showemailID"></unset>
<set token="showuseridentity"></set>
</condition>
<condition value="tab_type4">
<unset token="home_token"></unset>
<unset token="tab_type1_token"></unset>
<unset token="tab_type2_token"></unset>
<unset token="tab_type3_token"></unset>
<set token="tab_type4_token"></set>
<set token="showusername"></set>
<set token="showhostname"></set>
<set token="showsource_IP"></set>
<set token="showdestination_IP"></set>
<set token="showemailID"></set>
<set token="showuseridentity"></set>
</condition>
<condition>
<set token="tokLabel">$label$</set>
<set token="home_token"></set>
</condition>
</change>
</input>
<html>
<style>
/* This Layout Panel Bottom Padding removed to merge Link Input with horizontal line */
#panel_layout .fieldset{
padding: 10px 12px 0px 12px !important;
}
/* Increase width of Link input to have options in Single Line */
#tab_tab1.input-link{
width:100%;
}
/* Change from flex to -webkit-box for side by side layout */
#input_radio_split_by.input-link div[data-component="splunk-core:/splunkjs/mvc/components/LinkList"]{
display: -webkit-box !important;
}
/* Create Button Border to make them appear as Tabs */
#tab_tab1.input-link button{
/*width: 120px !important;*/
border-top-color: rgb(255, 255, 255);
border-top-style: solid;
border-top-width: 1px;
border-right-color: rgb(255, 255, 255);
border-right-style: solid;
border-right-width: 1px;
border-left-color: rgb(255, 255, 255);
border-left-style: solid;
border-left-width: 1px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
/* Hide link input bottom message section to merge with Horizontal line */
.dashboard-panel #input_link_split_by label,
#tab_tab1 .splunk-choice-input-message{
display: none !important;
}
/* Remove padding from horizontal line */
#panel_layout .panel-body.html{
padding: 0px !important;
}
</style>
<hr style="height:1px;border-width:0;color: black;background-color: white;margin: 0px;"/>
</html>
</fieldset>
<row>
<panel depends="$initial_token$" id="initial_panel">
<title>Click on input values to view results</title>
<html>
<style>
/* #initial_panel .dashboard-panel{
background-color:#F0F0F0 !important;
}*/
.dashboard-row #initial_panel .dashboard-panel h2.panel-title {
font-size: 20px !important;
color:#1A237E !important;
allign: center;
}
</style>
</html>
</panel>
</row>
</form>
@Ankit_kiraula wrote:... I'm not able to use multiple depends="token name" command in the in input text field tag
depends="$tok_1$,$tok_2$"
You could use CSS to show/hide the inputs
<form>
<label>Tabbed dashboard</label>
<fieldset submitButton="false">
<input type="text" token="username" id="username">
<label>username</label>
</input>
<input type="text" token="hostname" id="hostname">
<label>hostname</label>
</input>
<input type="text" token="source_IP" id="source_IP">
<label>source_IP</label>
</input>
<input type="text" token="destination_IP" id="destination_IP">
<label>destination_IP</label>
</input>
<input type="text" token="emailID" id="emailID">
<label>emailID</label>
</input>
<input type="text" token="useridentity" id="useridentity">
<label>user identity</label>
</input>
<input type="link" token="tab_type" searchWhenChanged="true" id="tab_tab1">
<label>Type of tab</label>
<choice value="tab_type1">Tab1</choice>
<choice value="tab_type2">Tab2</choice>
<choice value="tab_type3">Tab3</choice>
<choice value="tab_type4">Tab4</choice>
<change>
<condition value="tab_type1">
<unset token="home_token"></unset>
<set token="tab_type1_token"></set>
<unset token="tab_type2_token"></unset>
<unset token="tab_type3_token"></unset>
<unset token="tab_type4_token"></unset>
<set token="showusername">inline-block</set>
<set token="showhostname">inline-block</set>
<set token="showsource_IP">none</set>
<set token="showdestination_IP">none</set>
<set token="showemailID">none</set>
<set token="showuseridentity">none</set>
</condition>
<condition value="tab_type2">
<unset token="home_token"></unset>
<unset token="tab_type1_token"></unset>
<set token="tab_type2_token"></set>
<unset token="tab_type3_token"></unset>
<unset token="tab_type4_token"></unset>
<set token="showusername">none</set>
<set token="showhostname">none</set>
<set token="showsource_IP">inline-block</set>
<set token="showdestination_IP">inline-block</set>
<set token="showemailID">none</set>
<set token="showuseridentity">none</set>
</condition>
<condition value="tab_type3">
<unset token="home_token"></unset>
<unset token="tab_type1_token"></unset>
<unset token="tab_type2_token"></unset>
<set token="tab_type3_token"></set>
<unset token="tab_type4_token"></unset>
<set token="showusername">inline-block</set>
<set token="showhostname">inline-block</set>
<set token="showsource_IP">none</set>
<set token="showdestination_IP">none</set>
<set token="showemailID">none</set>
<set token="showuseridentity">inline-block</set>
</condition>
<condition value="tab_type4">
<unset token="home_token"></unset>
<unset token="tab_type1_token"></unset>
<unset token="tab_type2_token"></unset>
<unset token="tab_type3_token"></unset>
<set token="tab_type4_token"></set>
<set token="showusername">inline-block</set>
<set token="showhostname">inline-block</set>
<set token="showsource_IP">inline-block</set>
<set token="showdestination_IP">inline-block</set>
<set token="showemailID">inline-block</set>
<set token="showuseridentity">inline-block</set>
</condition>
<condition>
<set token="tokLabel">$label$</set>
<set token="home_token"></set>
</condition>
</change>
</input>
<html>
<style>
/* This Layout Panel Bottom Padding removed to merge Link Input with horizontal line */
#panel_layout .fieldset{
padding: 10px 12px 0px 12px !important;
}
/* Increase width of Link input to have options in Single Line */
#tab_tab1.input-link{
width:100%;
}
/* Change from flex to -webkit-box for side by side layout */
#input_radio_split_by.input-link div[data-component="splunk-core:/splunkjs/mvc/components/LinkList"]{
display: -webkit-box !important;
}
/* Create Button Border to make them appear as Tabs */
#tab_tab1.input-link button{
/*width: 120px !important;*/
border-top-color: rgb(255, 255, 255);
border-top-style: solid;
border-top-width: 1px;
border-right-color: rgb(255, 255, 255);
border-right-style: solid;
border-right-width: 1px;
border-left-color: rgb(255, 255, 255);
border-left-style: solid;
border-left-width: 1px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
/* Hide link input bottom message section to merge with Horizontal line */
.dashboard-panel #input_link_split_by label,
#tab_tab1 .splunk-choice-input-message{
display: none !important;
}
/* Remove padding from horizontal line */
#panel_layout .panel-body.html{
padding: 0px !important;
}
#username {
display: $showusername$;
}
#hostname {
display: $showhostname$;
}
#source_IP {
display: $showsource_IP$;
}
#destination_IP {
display: $showdestination_IP$;
}
#emailID {
display: $showemailID$;
}
#useridentity {
display: $showuseridentity$;
}
</style>
<hr style="height:1px;border-width:0;color: black;background-color: white;margin: 0px;"/>
</html>
</fieldset>
<row>
<panel depends="$initial_token$" id="initial_panel">
<title>Click on input values to view results</title>
<html>
<style>
.dashboard-row #initial_panel .dashboard-panel h2.panel-title {
font-size: 20px !important;
color:#1A237E !important;
allign: center;
}
</style>
</html>
</panel>
</row>
</form>
Thank you @ITWhisperer
but im not using CSS as of now its just simple XML, do you have any suggestion with out using CSS?
<form>
<label>Tabbed dashboard with depends</label>
<fieldset submitButton="false">
<input type="text" token="username" id="username" depends="$showusername$">
<label>username</label>
</input>
<input type="text" token="hostname" id="hostname" depends="$showhostname$">
<label>hostname</label>
</input>
<input type="text" token="source_IP" id="source_IP" depends="$showsource_IP$">
<label>source_IP</label>
</input>
<input type="text" token="destination_IP" id="destination_IP" depends="$showdestination_IP$">
<label>destination_IP</label>
</input>
<input type="text" token="emailID" id="emailID" depends="$showemailID$">
<label>emailID</label>
</input>
<input type="text" token="useridentity" id="useridentity" depends="$showuseridentity$">
<label>user identity</label>
</input>
<input type="link" token="tab_type" searchWhenChanged="true" id="tab_tab1">
<label>Type of tab</label>
<choice value="tab_type1">Tab1</choice>
<choice value="tab_type2">Tab2</choice>
<choice value="tab_type3">Tab3</choice>
<choice value="tab_type4">Tab4</choice>
<change>
<condition value="tab_type1">
<unset token="home_token"></unset>
<set token="tab_type1_token"></set>
<unset token="tab_type2_token"></unset>
<unset token="tab_type3_token"></unset>
<unset token="tab_type4_token"></unset>
<set token="showusername">k</set>
<set token="showhostname"></set>
<unset token="showsource_IP"></unset>
<unset token="showdestination_IP"></unset>
<unset token="showemailID"></unset>
<unset token="showuseridentity"></unset>
</condition>
<condition value="tab_type2">
<unset token="home_token"></unset>
<unset token="tab_type1_token"></unset>
<set token="tab_type2_token"></set>
<unset token="tab_type3_token"></unset>
<unset token="tab_type4_token"></unset>
<unset token="showusername"></unset>
<unset token="showhostname"></unset>
<set token="showsource_IP"></set>
<set token="showdestination_IP"></set>
<unset token="showemailID"></unset>
<unset token="showuseridentity"></unset>
</condition>
<condition value="tab_type3">
<unset token="home_token"></unset>
<unset token="tab_type1_token"></unset>
<unset token="tab_type2_token"></unset>
<set token="tab_type3_token"></set>
<unset token="tab_type4_token"></unset>
<set token="showusername"></set>
<set token="showhostname"></set>
<unset token="showsource_IP"></unset>
<unset token="showdestination_IP"></unset>
<unset token="showemailID"></unset>
<set token="showuseridentity"></set>
</condition>
<condition value="tab_type4">
<unset token="home_token"></unset>
<unset token="tab_type1_token"></unset>
<unset token="tab_type2_token"></unset>
<unset token="tab_type3_token"></unset>
<set token="tab_type4_token"></set>
<set token="showusername"></set>
<set token="showhostname"></set>
<set token="showsource_IP"></set>
<set token="showdestination_IP"></set>
<set token="showemailID"></set>
<set token="showuseridentity"></set>
</condition>
<condition>
<set token="tokLabel">$label$</set>
<set token="home_token"></set>
</condition>
</change>
</input>
<html>
<style>
/* This Layout Panel Bottom Padding removed to merge Link Input with horizontal line */
#panel_layout .fieldset{
padding: 10px 12px 0px 12px !important;
}
/* Increase width of Link input to have options in Single Line */
#tab_tab1.input-link{
width:100%;
}
/* Change from flex to -webkit-box for side by side layout */
#input_radio_split_by.input-link div[data-component="splunk-core:/splunkjs/mvc/components/LinkList"]{
display: -webkit-box !important;
}
/* Create Button Border to make them appear as Tabs */
#tab_tab1.input-link button{
/*width: 120px !important;*/
border-top-color: rgb(255, 255, 255);
border-top-style: solid;
border-top-width: 1px;
border-right-color: rgb(255, 255, 255);
border-right-style: solid;
border-right-width: 1px;
border-left-color: rgb(255, 255, 255);
border-left-style: solid;
border-left-width: 1px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
/* Hide link input bottom message section to merge with Horizontal line */
.dashboard-panel #input_link_split_by label,
#tab_tab1 .splunk-choice-input-message{
display: none !important;
}
/* Remove padding from horizontal line */
#panel_layout .panel-body.html{
padding: 0px !important;
}
</style>
<hr style="height:1px;border-width:0;color: black;background-color: white;margin: 0px;"/>
</html>
</fieldset>
<row>
<panel depends="$initial_token$" id="initial_panel">
<title>Click on input values to view results</title>
<html>
<style>
/* #initial_panel .dashboard-panel{
background-color:#F0F0F0 !important;
}*/
.dashboard-row #initial_panel .dashboard-panel h2.panel-title {
font-size: 20px !important;
color:#1A237E !important;
allign: center;
}
</style>
</html>
</panel>
</row>
</form>
thank you so much it worked like charm