Dashboards & Visualizations

Is there a way to paginate search results or to paginate all panels at the same time?

gcusello
Legend

Hi at all,
I have a dashboard where I display in graphic mode (red or green icons) status of four checks that i run on several hosts.
To use graphic display I used the solution of Splunk 6.x Dashboard Examples "Table Icon Set (Rangemap)" customized for use five panels (one for hosts and one for the four status checks) instead one.
My dashboard was perfect until the number of hosts was less than 100, but now they are 101 and the are growing!
The problem is that I cannot display more than 100 rows in a table and I didn't find any solution to change this limit, so there are the pagination buttons but one for each panel so using one of them the other aren't paginated.
Is there a way to use a limit greater than 100 on dashboard's rows?
Or is it possible to have more Icon rangemap in the same panel?
Otherwise, is there a way to paginate search results: e.g. first 100, second 100, .... so I can use this method to paginate all panels at the same time, eventually using an input?
I hope to be clear!

Thank you in advance.
Bye.
Giuseppe

1 Solution

niketnilay
Legend

Since you have 100 Rows per page you just need a toggle between two pages. Easiest approach would be to use Link input and tough but robust would be to use HTML elements with jQuery.

alt text

For explanation I have used 20 rows in my base search and created previous and next pages of 10 rows each. You can use up to 200 with 100 in each page. Obviously you can extend this concept to create your own pagination the way you want similar to what Splunk has but linked for all tables.

Step 1 : Create your base searches for different tables with stats for all rows (in example it is 20). Add row number using accum

Step 2 : Create prev and next links using Link input and set query filter token as | search row<11 and | search row>10 based on respective link clicked.

Step 3 : Refer to base query in table using post processing and the apply filter query from previous step.

Step 4 : (Optional) hide row column in table using <fields> simple XML configuration for table. Show only required fields.

Step 5 : (Optional) Apply HTML body style to reduce height of Panel with << prev and next>> link.

Following is complete Simple XML (no changes required to existing CSS and JS).

<form script="table_icons_rangemap.js" stylesheet="table_decorations.css">
  <label>Previous Next page selection for Multiple Tables</label>
  <!-- Search Query for table1 -->
  <search id="query1">
    <query>index=_internal sourcetype=splunkd
| stats count by component
| head 20
| eval row=1
| accum row
| rangemap field=count low=0-100 elevated=101-1000 default=severe
| table row component count range</query>
    <earliest>-24h@h</earliest>
    <latest>now</latest>
  </search>
  <!-- Search Query for table2 -->
  <search id="query2">
    <query>index=_internal sourcetype=splunkd
| stats count by component
| head 20
| eval row=1
| accum row
| rangemap field=count low=0-100 elevated=101-1000 default=severe
| table row component count range</query>
    <earliest>-24h@h</earliest>
    <latest>now</latest>
  </search>
  <fieldset submitButton="false"></fieldset>
  <row>
    <panel>
      <html depends="$alwaysHideCSS$">
        <style>
          #fieldset1{
              width: 220px;
              height: 80px;
          }
        </style>
      </html>      
      <input id="fieldset1" type="link" token="tokLink">
        <label></label>
        <choice value="prev"><< prev</choice>
        <choice value="next">next >></choice>
        <change>
          <condition value="prev">
            <set token="filter">| search row<11</set>
          </condition>
          <condition value="next">
            <set token="filter">| search row>10</set>
          </condition>
        </change>
        <default>prev</default>
      </input>
    </panel>
  </row>
  <row>
    <panel>
      <table id="table1">
        <title>Table 1</title>
        <search base="query1">
          <query>$filter$</query>
        </search>
        <option name="count">10</option>
        <option name="drilldown">none</option>
        <fields>["component","count","range"]</fields>
      </table>
    </panel>
    <panel>
      <table id="table2">
        <title>Table 2</title>
        <search base="query2">
          <query>$filter$</query>
        </search>
        <option name="count">10</option>
        <option name="drilldown">none</option>
        <fields>["component","count","range"]</fields>
      </table>
    </panel>
  </row>
</form>

Please try out and confirm.

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"

View solution in original post

niketnilay
Legend

Since you have 100 Rows per page you just need a toggle between two pages. Easiest approach would be to use Link input and tough but robust would be to use HTML elements with jQuery.

alt text

For explanation I have used 20 rows in my base search and created previous and next pages of 10 rows each. You can use up to 200 with 100 in each page. Obviously you can extend this concept to create your own pagination the way you want similar to what Splunk has but linked for all tables.

Step 1 : Create your base searches for different tables with stats for all rows (in example it is 20). Add row number using accum

Step 2 : Create prev and next links using Link input and set query filter token as | search row&lt;11 and | search row&gt;10 based on respective link clicked.

Step 3 : Refer to base query in table using post processing and the apply filter query from previous step.

Step 4 : (Optional) hide row column in table using <fields> simple XML configuration for table. Show only required fields.

Step 5 : (Optional) Apply HTML body style to reduce height of Panel with << prev and next>> link.

Following is complete Simple XML (no changes required to existing CSS and JS).

<form script="table_icons_rangemap.js" stylesheet="table_decorations.css">
  <label>Previous Next page selection for Multiple Tables</label>
  <!-- Search Query for table1 -->
  <search id="query1">
    <query>index=_internal sourcetype=splunkd
| stats count by component
| head 20
| eval row=1
| accum row
| rangemap field=count low=0-100 elevated=101-1000 default=severe
| table row component count range</query>
    <earliest>-24h@h</earliest>
    <latest>now</latest>
  </search>
  <!-- Search Query for table2 -->
  <search id="query2">
    <query>index=_internal sourcetype=splunkd
| stats count by component
| head 20
| eval row=1
| accum row
| rangemap field=count low=0-100 elevated=101-1000 default=severe
| table row component count range</query>
    <earliest>-24h@h</earliest>
    <latest>now</latest>
  </search>
  <fieldset submitButton="false"></fieldset>
  <row>
    <panel>
      <html depends="$alwaysHideCSS$">
        <style>
          #fieldset1{
              width: 220px;
              height: 80px;
          }
        </style>
      </html>      
      <input id="fieldset1" type="link" token="tokLink">
        <label></label>
        <choice value="prev"><< prev</choice>
        <choice value="next">next >></choice>
        <change>
          <condition value="prev">
            <set token="filter">| search row<11</set>
          </condition>
          <condition value="next">
            <set token="filter">| search row>10</set>
          </condition>
        </change>
        <default>prev</default>
      </input>
    </panel>
  </row>
  <row>
    <panel>
      <table id="table1">
        <title>Table 1</title>
        <search base="query1">
          <query>$filter$</query>
        </search>
        <option name="count">10</option>
        <option name="drilldown">none</option>
        <fields>["component","count","range"]</fields>
      </table>
    </panel>
    <panel>
      <table id="table2">
        <title>Table 2</title>
        <search base="query2">
          <query>$filter$</query>
        </search>
        <option name="count">10</option>
        <option name="drilldown">none</option>
        <fields>["component","count","range"]</fields>
      </table>
    </panel>
  </row>
</form>

Please try out and confirm.

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"

View solution in original post

gcusello
Legend

Perfect!
I don't understand why you suggest to use two identical post process searches, but your solution solves my problems.
Thank you.
Bye.
Giuseppe

0 Karma

niketnilay
Legend

@cusello, I was just being lazy to write a different search 🙂
Glad it worked!!! Happy Friday 🙂

____________________________________________
| makeresults | eval message= "Happy Splunking!!!"
0 Karma

DalJeanis
SplunkTrust
SplunkTrust

First, let me ask a question for a semi-trivial solution. Is there room on the dash line for two sets of 5?

0 Karma

gcusello
Legend

Thanks DalJeanis,
in the same row I haven't enogh space but I could put the second 5 panels in another row: it could be a solution.
But the problem is that I don't know how to display in the first 5 panels the first 100 rows and in the second 5 panels the others.
Anyway, if I find the metod to make this separation I solved the problem because I can put it in an input dropdown and then use it to show only a 100 rows.
Bye.
Giuseppe

0 Karma
Did you miss .conf21 Virtual?

Good news! The event's keynotes and many of its breakout sessions are now available online, and still totally FREE!