Dashboards & Visualizations

Align link type input in simple XML

support0
Path Finder

Hello there,

Is it somehow possible to align input type links on the same line in simple xml ?

For instance, in this screenshot :

alt text

I am trying, on the right panel, to put "Down", "Unchecked", "Checking" & "UP" links on the same line.

I have seen some css around, but cannot make it work for now.

Any idea ?

Thanks in advance,

0 Karma
1 Solution

mayurr98
Super Champion

hey you can try something like this

<form>
  <label>Prueba</label>
  <fieldset submitButton="false"></fieldset>
  <row>
    <html>
       <style>
         .input-link {
           min-width: 500px !important;
           width: 500px !important;
           max-width: 500px !important;
         }
       </style>
     </html>
     </row>
  <row>
    <panel>
      <single>
        <search>
          <query>bar|stats count</query>
        </search>
        <drilldown>
          <eval token="form.linkinput">"link2"</eval>
          <unset token="form.pools_down"></unset>
        </drilldown>
      </single>
    </panel>

    <panel>
      <input type="link" token="linkinput">
        <label>$linkinput$</label>
        <choice value="link1">Down</choice>
        <choice value="link2">Up</choice>
        <choice value="link3">Unchecked</choice>
        <choice value="link4">checked</choice>
        <default>link1</default>
        <change>

          <condition value="link1">
            <set token="form.pools_down">index=_internal | stats count</set>
            <unset token="form.pools_up"></unset>
          </condition>
          <condition value="link2">
            <set token="form.pools_up">index=_internal | stats count</set>
            <unset token="form.pools_down"></unset>
          </condition>
          <condition value="link3">
            <set token="form.pools_unchecked">index=_internal | stats count</set>
            <unset token="form.pools_down"></unset>
          </condition>
          <condition value="link4">
            <set token="form.pools_checked">index=_internal | stats count</set>
            <unset token="form.pools_down"></unset>
          </condition>
        </change>
      </input>
      <table depends="$form.pools_down$">
        <search>
          <query>$form.pools_down$</query>
        </search>
      </table>
      <table depends="$form.pools_up$">
        <search>
          <query>$form.pools_up$</query>
        </search>
      </table>
      <table depends="$form.pools_unchecked$">
        <search>
          <query>$form.pools_unchecked$</query>
        </search>
      </table>
      <table depends="$form.pools_checked$">
        <search>
          <query>$form.pools_checked$</query>
        </search>
      </table>
    </panel>
    <row>
     <html>
       <style>
         .input-dropdown {
           min-width: 120px !important;
           width: 120px !important;
           max-width: 120px !important;
         }
         .splunk-dropdown .select2-container {
           min-width: 120px !important;
           width: 120px !important;
           max-width: 120px !important;
         }
         .input-text {
           min-width: 130px !important;
           width: 130px !important;
           max-width: 130px !important;
         }
         .input-text > input[type="text"] {
           min-width: 120px !important;
           width: 120px !important;
           max-width: 120px !important;
         }        
       </style>
     </html>
   </row>
    </row>
</form>

you can set width using inline css

<row>
    <html>
       <style>
         .input-link {
           min-width: 500px !important;
           width: 500px !important;
           max-width: 500px !important;
         }
       </style>
     </html>
     </row>

using this you can increase the input link type width

let me know if this helps!

View solution in original post

mayurr98
Super Champion

hey you can try something like this

<form>
  <label>Prueba</label>
  <fieldset submitButton="false"></fieldset>
  <row>
    <html>
       <style>
         .input-link {
           min-width: 500px !important;
           width: 500px !important;
           max-width: 500px !important;
         }
       </style>
     </html>
     </row>
  <row>
    <panel>
      <single>
        <search>
          <query>bar|stats count</query>
        </search>
        <drilldown>
          <eval token="form.linkinput">"link2"</eval>
          <unset token="form.pools_down"></unset>
        </drilldown>
      </single>
    </panel>

    <panel>
      <input type="link" token="linkinput">
        <label>$linkinput$</label>
        <choice value="link1">Down</choice>
        <choice value="link2">Up</choice>
        <choice value="link3">Unchecked</choice>
        <choice value="link4">checked</choice>
        <default>link1</default>
        <change>

          <condition value="link1">
            <set token="form.pools_down">index=_internal | stats count</set>
            <unset token="form.pools_up"></unset>
          </condition>
          <condition value="link2">
            <set token="form.pools_up">index=_internal | stats count</set>
            <unset token="form.pools_down"></unset>
          </condition>
          <condition value="link3">
            <set token="form.pools_unchecked">index=_internal | stats count</set>
            <unset token="form.pools_down"></unset>
          </condition>
          <condition value="link4">
            <set token="form.pools_checked">index=_internal | stats count</set>
            <unset token="form.pools_down"></unset>
          </condition>
        </change>
      </input>
      <table depends="$form.pools_down$">
        <search>
          <query>$form.pools_down$</query>
        </search>
      </table>
      <table depends="$form.pools_up$">
        <search>
          <query>$form.pools_up$</query>
        </search>
      </table>
      <table depends="$form.pools_unchecked$">
        <search>
          <query>$form.pools_unchecked$</query>
        </search>
      </table>
      <table depends="$form.pools_checked$">
        <search>
          <query>$form.pools_checked$</query>
        </search>
      </table>
    </panel>
    <row>
     <html>
       <style>
         .input-dropdown {
           min-width: 120px !important;
           width: 120px !important;
           max-width: 120px !important;
         }
         .splunk-dropdown .select2-container {
           min-width: 120px !important;
           width: 120px !important;
           max-width: 120px !important;
         }
         .input-text {
           min-width: 130px !important;
           width: 130px !important;
           max-width: 130px !important;
         }
         .input-text > input[type="text"] {
           min-width: 120px !important;
           width: 120px !important;
           max-width: 120px !important;
         }        
       </style>
     </html>
   </row>
    </row>
</form>

you can set width using inline css

<row>
    <html>
       <style>
         .input-link {
           min-width: 500px !important;
           width: 500px !important;
           max-width: 500px !important;
         }
       </style>
     </html>
     </row>

using this you can increase the input link type width

let me know if this helps!

support0
Path Finder

Works like a charm! Thanks a lot!

0 Karma

mayurr98
Super Champion

can you provide XML? for the right panel

0 Karma
Get Updates on the Splunk Community!

Enterprise Security Content Update (ESCU) | New Releases

In December, the Splunk Threat Research Team had 1 release of new security content via the Enterprise Security ...

Why am I not seeing the finding in Splunk Enterprise Security Analyst Queue?

(This is the first of a series of 2 blogs). Splunk Enterprise Security is a fantastic tool that offers robust ...

Index This | What are the 12 Days of Splunk-mas?

December 2024 Edition Hayyy Splunk Education Enthusiasts and the Eternally Curious!  We’re back with another ...