topic Re: How to freeze first 3~4 columns in a table in Dashboards & Visualizations

How to freeze first 3~4 columns in a table

ravitejaj — Wed, 01 Feb 2017 11:44:23 GMT

How to freeze first 3~4 columns in a table view in a dashboard

Re: How to freeze first 3~4 columns in a table

rjthibod — Wed, 01 Feb 2017 13:08:48 GMT

The community can best help you if you provide details about the search you are using.

My first guess is that you want to use the table search query where you would list the fields you want first, e.g., | table field1 field2 field3 field4 ...

Re: How to freeze first 3~4 columns in a table

ravitejaj — Wed, 01 Feb 2017 17:08:52 GMT

Yes exactly..

Re: How to freeze first 3~4 columns in a table

rjthibod — Wed, 01 Feb 2017 17:19:39 GMT

Does my answer work for you? | table field1 field2 field3 field4 ...

If you want more help, share your query.

Re: How to freeze first 3~4 columns in a table

ravitejaj — Wed, 01 Feb 2017 23:12:56 GMT

This is for table representation.. What I'm looking for is to freeze the first 2~3 columns on the left while others can be scrolled while we have he results on Wrap OFF.

Re: How to freeze first 3~4 columns in a table

mpreddy — Wed, 01 Feb 2017 23:38:51 GMT

If you are looking for Excel related features try to implement JQuery with Html in splunk

URL for JQuery for freeze:

https://plugins.jquery.com/tablefreeze/

@ravitejaj

You can give a try like this

base query |table * |fields - a,b,c,d

Re: How to freeze first 3~4 columns in a table

ravitejaj — Wed, 01 Feb 2017 23:47:45 GMT

This will just restrict the number of fields that gets displayed.. I need all the fields.. say for ex: I have 10 fields, First 3/4 on the left should freeze while others Scroll.

Re: How to freeze first 3~4 columns in a table

rjthibod — Thu, 02 Feb 2017 00:15:08 GMT

That is something different.

This will require custom CSS on your table. You will have to add a CSS file to the dashboard to set the appropriate CSS settings on the first 2-3 columsn. You cannot do what you are requesting in SimpleXML.

Re: How to freeze first 3~4 columns in a table

ravitejaj — Thu, 02 Feb 2017 01:08:28 GMT

Yeah, I get it.. Do we have any sample css for this ?

Re: How to freeze first 3~4 columns in a table

mrgibbon — Thu, 02 Feb 2017 01:56:40 GMT

Ah you mean like you can in Excel. Hmm.

Re: How to freeze first 3~4 columns in a table

rjthibod — Thu, 02 Feb 2017 11:50:29 GMT

Probably not. Check google and stackoverflow for examples of how to freeze table columns, and then use browser developer tools or Splunk answers to identify the specific CSS elements to target.

Re: How to freeze first 3~4 columns in a table

vasanthmss — Thu, 25 Jul 2019 23:01:52 GMT

Here is the sample code which used _internal index and freezes first column with similar logic for other columns.

myTable is the table id, and using hidden html style applied the css. Make sure that one extra column with similar to first column. here frozen column is host , created one more column host1 which holds the same data.

<dashboard hideEdit="false">
  <label>Fixed Column Test</label>
  <row depends="$never$">
    <panel>
      <html>
        <style>
          #myTable div [data-view="views/shared/results_table/ResultsTableMaster"] td:nth-child(1) {
              position: fixed;
             }
             #myTable div [data-view="views/shared/results_table/ResultsTableMaster"] th:nth-child(1) {
              position: fixed;
             }
        </style>
      </html>
    </panel>
  </row>
  <row>
    <panel>
      <table id="myTable">
        <search>
          <query>index=_internal sourcetype=splunkd |head 100 |eval host1=host | table host,host1, _time, sourcetype, source date* _raw *</query>
          <earliest>-60m@m</earliest>
          <latest>now</latest>
          <sampleRatio>1</sampleRatio>
          <refresh>5m</refresh>
          <refreshType>delay</refreshType>
        </search>
        <option name="count">15</option>
        <option name="dataOverlayMode">none</option>
        <option name="drilldown">none</option>
        <option name="percentagesRow">false</option>
        <option name="rowNumbers">false</option>
        <option name="totalsRow">false</option>
        <option name="wrap">false</option>
        <format type="color" field="index9">
          <colorPalette type="sharedList"></colorPalette>
          <scale type="sharedCategory"></scale>
        </format>
        <format type="color" field="host">
          <colorPalette type="sharedList"></colorPalette>
          <scale type="sharedCategory"></scale>
        </format>
      </table>
    </panel>
  </row>
</dashboard>

Note: This uses column fix so if you have bigger table or multiple table you may see the fixed column for a while then it will hide. Use rows per page to limit the records.

Hope that helps,

Cheers !!!