All Apps and Add-ons

Sideview Table - How to wordwrap at certain width

IngloriousSplun
Communicator

Is there a CSS or other parameter that can be set for the Sideview Table module to word wrap after a certain width? I have some fields that have particularly long content, such as suspicious / malicious URLs and the wrap default sometimes requires scrolling.

Thanks.

0 Karma

sideview
SplunkTrust
SplunkTrust

URL's are particularly tricky because the are single enormous words, and normal wrapping isn't allowed to break words. Of course there are ways to do this.

If you have a good browser spec I think you can just do

<module name="Table">
  <param name="cssClass">wordBreakingTable</param>

and then in your application.css

.wordBreakingTable td {
word-wrap: break-word;
}

However depending on your browser support and specific requirements you might need to get a little tweakier than that. Here is some further reading.
https://css-tricks.com/snippets/css/prevent-long-urls-from-breaking-out-of-container/

0 Karma

IngloriousSplun
Communicator

I wonder if the issue is that I don't have a defined size for the Table or cell? The above CSS is not working. The URL structure is similar to: host.domain.com/20983209234j2lokj2342092098234jMMSDSM298230924ljk23j2o2092348234l234204928340983422nlkj234.

Other events with similarly long URLs, but that include %, =, etc break fine, it's just those that are only alphanumeric characters that don't.

I've tried the above CSS, that doesn't work and I've also tried the following without luck:

-ms-word-break: break-all;
    word-break: break-all;
    word-break: break-word;

word-wrap: break-word;

-webkit-hyphens: auto;
    -moz-hypens: auto;
        hyphens: auto;

white-space: pre;
white-space: pre-wrap;
white-space: pre-line;
white-space: -pre-wrap;
white-space: -o-pre-wrap;
white-space: -moz-pre-wrap;
0 Karma

sideview
SplunkTrust
SplunkTrust

Actually you might try a completely different approach, using Table Embedding to effectively truncate the urls if they're too long.

basic idea - You use the search language to make another field, called say "truncatedUrl". If the url is less than N characters, it holds the url value. Otherwise it holds the first N-5 chars plus "...". Then you have
<module name="Table">
<param name="hiddenFields">truncatedUrl</param>
<module name="HTML" group="row.fields.url">
<param name="html">$truncatedUrl$</param>
</module>
</module>

It's a good table-embedding trick. On a couple apps I've also built simple little "expand/collapse" links so the user can expand it to the un-truncated value if/when they want. That does admittedly require a few lines of JS.

0 Karma

IngloriousSplun
Communicator

Yeah, they'd have to be able to see the full URL because these are security incidents from sensors. I also thought about using sed to insert a '\n' after 50 characters, but then the URL is actually broken at that point and changes some other stuff I'm doing.

0 Karma

sideview
SplunkTrust
SplunkTrust

Getting closer. OK use sed but do your shenanigans on a separate field called like displayURL. have the real url field listed in the Table module's "hiddenFields" param. Then you can use Table Embedding to display the "displayURL" field, but for all drilldown purposes and everything else use the real url field. Despite being "hidden", it'll be available in drilldown tokens etc.

0 Karma

IngloriousSplun
Communicator

Interesting. So eval the URL field to a new field, use sed to insert a new line on that field and display that field, but maintain the real URL in a hidden field to perform lookups and drilldowns on. I'll try that in a bit and let you know.

0 Karma
Get Updates on the Splunk Community!

How to Monitor Google Kubernetes Engine (GKE)

We’ve looked at how to integrate Kubernetes environments with Splunk Observability Cloud, but what about ...

Index This | How can you make 45 using only 4?

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

Splunk Education Goes to Washington | Splunk GovSummit 2024

If you’re in the Washington, D.C. area, this is your opportunity to take your career and Splunk skills to the ...