https://community.splunk.com/t5/Splunk-Dev/Auto-expand-a-nested-list-in-a-JSON-log/m-p/694066#M11619 <P>Here is what I did for v9.1.5</P><P>Add CSS to<BR /><SPAN>/opt/</SPAN><SPAN class="">splunk</SPAN><SPAN>/share/</SPAN><SPAN class="">splunk</SPAN><SPAN>/search_mrsparkle/exposed/build/css/bootstrap-dark.css</SPAN><BR /><SPAN>/opt/</SPAN><SPAN class="">splunk</SPAN><SPAN>/share/</SPAN><SPAN class="">splunk</SPAN><SPAN>/search_mrsparkle/exposed/build/css/bootstrap-light.css</SPAN><BR />------------------</P><LI-CODE lang="css"> /* The switch - the box around the slider*/ .autoexpand { margin-top: 2px; } .autoexpandtext { margin-right: 5px; } .switch { position: relative; display: inline-block; width: 43px; height: 18px; margin-top:5px; margin-bottom:0px; } /* Hide default HTML checkbox */ .switch input { opacity: 0; width: 0; height: 0; } /* The slider */ .slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc; -webkit-transition: .4s; transition: .4s; } .slider:before { position: absolute; content: ""; height: 10px; width: 10px; left: 4px; bottom: 4px; background-color: white; -webkit-transition: .4s; transition: .4s; } input:checked + .slider { background-color: rgb(92, 192, 92); } input:focus + .slider { box-shadow: 0 0 1px #2196F3; } input:checked + .slider:before { -webkit-transform: translateX(26px); -ms-transform: translateX(26px); transform: translateX(26px); } /* Rounded sliders */ .slider.round { border-radius: 34px; } .slider.round:before { border-radius: 50%; }</LI-CODE><P><SPAN><BR /><BR />In<BR />/opt/<SPAN class="">splunk</SPAN>/share/<SPAN class="">splunk</SPAN>/search_mrsparkle/exposed/build/pages/dark/search.js<BR />/opt/<SPAN class="">splunk</SPAN>/share/<SPAN class="">splunk</SPAN>/search_mrsparkle/exposed/build/pages/light/search.js<BR />search for&nbsp;"pull-right jobstatus-control-grouping" and add this text in that div element<BR /><BR />-----------------<BR /></SPAN></P><LI-CODE lang="javascript">&lt;div class="autoexpand"&gt;&lt;span class="autoexpandtext"&gt;AutoexpandJSON&lt;/span&gt;&lt;label class="switch"&gt;&lt;input type="checkbox" checked&gt;&lt;span class="slider round"&gt;&lt;/span&gt;&lt;/label&gt;&lt;/div&gt; </LI-CODE><P><SPAN>------------------<BR /><BR />In the same search.js files&nbsp;<BR />/opt/<SPAN class="">splunk</SPAN>/share/<SPAN class="">splunk</SPAN>/search_mrsparkle/exposed/build/pages/dark/search.js<BR />/opt/<SPAN class="">splunk</SPAN>/share/<SPAN class="">splunk</SPAN>/search_mrsparkle/exposed/build/pages/light/search.js<BR /><BR />add this scripts to the bottom</SPAN></P><P><SPAN>------------------<BR /></SPAN></P><LI-CODE lang="javascript">let autoExpandPropertyName='jsonAutoExpand'; let autoExpandSetting = localStorage.getItem(autoExpandPropertyName); let observer2Added =false; $(document).ready(function() { if (autoExpandSetting === null) { localStorage.setItem(autoExpandPropertyName, '1'); autoExpandSetting = '1'; } if(autoExpandSetting === '1') { function autoExpand(){ // console.log("autoExpand started"); $(".jsexpands").each(function() { if($(this).html() == '[+]') { $(this)[0].click(); } })}; setTimeout(()=&gt; { console.log("Delayed"); // select the target node var target = $(".shared-eventsviewer")[0]; console.log(target); // create an observer instance var observer6 = new MutationObserver(function(mutations) { mutations.forEach((mutation) =&gt; { if (!mutation.addedNodes) return autoExpand(); $(".events-controls-inner").click(); //does not refresh table if missing }) }); // configuration of the observer: var config = { attributes: false, childList: true, characterData: true, subtree:true}; // pass in the target node, as well as the observer options observer6.observe(target, config); }, "500"); } function toggleAutoexpand(mutation){ const slider = document.querySelector('.slider'); if (slider === undefined ||slider === null) return; if(observer2Added) return; observer2Added = true; if(autoExpandSetting === '0') { $(".switch")[0].childNodes[0].checked =false; } slider.addEventListener('click', () =&gt; { let storageValue = localStorage.getItem(autoExpandPropertyName); if ( storageValue === '1') localStorage.setItem(autoExpandPropertyName, '0'); else localStorage.setItem(autoExpandPropertyName, '1'); location.reload(); }); observer2.disconnect(); }; let observer2 = new MutationObserver((mutations) =&gt; { mutations.forEach((mutation) =&gt; { if (!mutation.addedNodes) return toggleAutoexpand(mutation); }) }) setTimeout(()=&gt; { observer2.observe($(".shared-eventsviewer")[0], { childList: true , subtree: true , attributes: false , characterData: false }) }, "500"); })</LI-CODE><P><SPAN>------------------<BR /><BR />To refresh the splunk css and js caching use link:&nbsp;<A class="" href="https://ls0pv-splhead-2:8000/en-GB/_bump" target="_blank" rel="noopener">https://yourinstance:8000/en-GB/_bump</A><BR /><BR />On the next splunk update you have to repeat the process if everything remains the same.<BR />I couldn't find any other way.<BR /><BR /></SPAN></P> Tue, 23 Jul 2024 14:21:34 GMT rokxer 2024-07-23T14:21:34Z https://community.splunk.com/t5/Splunk-Dev/Auto-expand-a-nested-list-in-a-JSON-log/m-p/432391#M7744 <P>Hi,</P> <P>i got a nested list in a json log file, problem is to open it i have every time to expand it using the + sign.</P> <P>there is any way to to this automatically? i would like to show it withtin the event and not separated using spath and mvexpand</P> <P>Thanks guys</P> Mon, 10 Dec 2018 10:23:19 GMT https://community.splunk.com/t5/Splunk-Dev/Auto-expand-a-nested-list-in-a-JSON-log/m-p/432391#M7744 0xlc 2018-12-10T10:23:19Z https://community.splunk.com/t5/Splunk-Dev/Auto-expand-a-nested-list-in-a-JSON-log/m-p/694066#M11619 <P>Here is what I did for v9.1.5</P><P>Add CSS to<BR /><SPAN>/opt/</SPAN><SPAN class="">splunk</SPAN><SPAN>/share/</SPAN><SPAN class="">splunk</SPAN><SPAN>/search_mrsparkle/exposed/build/css/bootstrap-dark.css</SPAN><BR /><SPAN>/opt/</SPAN><SPAN class="">splunk</SPAN><SPAN>/share/</SPAN><SPAN class="">splunk</SPAN><SPAN>/search_mrsparkle/exposed/build/css/bootstrap-light.css</SPAN><BR />------------------</P><LI-CODE lang="css"> /* The switch - the box around the slider*/ .autoexpand { margin-top: 2px; } .autoexpandtext { margin-right: 5px; } .switch { position: relative; display: inline-block; width: 43px; height: 18px; margin-top:5px; margin-bottom:0px; } /* Hide default HTML checkbox */ .switch input { opacity: 0; width: 0; height: 0; } /* The slider */ .slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc; -webkit-transition: .4s; transition: .4s; } .slider:before { position: absolute; content: ""; height: 10px; width: 10px; left: 4px; bottom: 4px; background-color: white; -webkit-transition: .4s; transition: .4s; } input:checked + .slider { background-color: rgb(92, 192, 92); } input:focus + .slider { box-shadow: 0 0 1px #2196F3; } input:checked + .slider:before { -webkit-transform: translateX(26px); -ms-transform: translateX(26px); transform: translateX(26px); } /* Rounded sliders */ .slider.round { border-radius: 34px; } .slider.round:before { border-radius: 50%; }</LI-CODE><P><SPAN><BR /><BR />In<BR />/opt/<SPAN class="">splunk</SPAN>/share/<SPAN class="">splunk</SPAN>/search_mrsparkle/exposed/build/pages/dark/search.js<BR />/opt/<SPAN class="">splunk</SPAN>/share/<SPAN class="">splunk</SPAN>/search_mrsparkle/exposed/build/pages/light/search.js<BR />search for&nbsp;"pull-right jobstatus-control-grouping" and add this text in that div element<BR /><BR />-----------------<BR /></SPAN></P><LI-CODE lang="javascript">&lt;div class="autoexpand"&gt;&lt;span class="autoexpandtext"&gt;AutoexpandJSON&lt;/span&gt;&lt;label class="switch"&gt;&lt;input type="checkbox" checked&gt;&lt;span class="slider round"&gt;&lt;/span&gt;&lt;/label&gt;&lt;/div&gt; </LI-CODE><P><SPAN>------------------<BR /><BR />In the same search.js files&nbsp;<BR />/opt/<SPAN class="">splunk</SPAN>/share/<SPAN class="">splunk</SPAN>/search_mrsparkle/exposed/build/pages/dark/search.js<BR />/opt/<SPAN class="">splunk</SPAN>/share/<SPAN class="">splunk</SPAN>/search_mrsparkle/exposed/build/pages/light/search.js<BR /><BR />add this scripts to the bottom</SPAN></P><P><SPAN>------------------<BR /></SPAN></P><LI-CODE lang="javascript">let autoExpandPropertyName='jsonAutoExpand'; let autoExpandSetting = localStorage.getItem(autoExpandPropertyName); let observer2Added =false; $(document).ready(function() { if (autoExpandSetting === null) { localStorage.setItem(autoExpandPropertyName, '1'); autoExpandSetting = '1'; } if(autoExpandSetting === '1') { function autoExpand(){ // console.log("autoExpand started"); $(".jsexpands").each(function() { if($(this).html() == '[+]') { $(this)[0].click(); } })}; setTimeout(()=&gt; { console.log("Delayed"); // select the target node var target = $(".shared-eventsviewer")[0]; console.log(target); // create an observer instance var observer6 = new MutationObserver(function(mutations) { mutations.forEach((mutation) =&gt; { if (!mutation.addedNodes) return autoExpand(); $(".events-controls-inner").click(); //does not refresh table if missing }) }); // configuration of the observer: var config = { attributes: false, childList: true, characterData: true, subtree:true}; // pass in the target node, as well as the observer options observer6.observe(target, config); }, "500"); } function toggleAutoexpand(mutation){ const slider = document.querySelector('.slider'); if (slider === undefined ||slider === null) return; if(observer2Added) return; observer2Added = true; if(autoExpandSetting === '0') { $(".switch")[0].childNodes[0].checked =false; } slider.addEventListener('click', () =&gt; { let storageValue = localStorage.getItem(autoExpandPropertyName); if ( storageValue === '1') localStorage.setItem(autoExpandPropertyName, '0'); else localStorage.setItem(autoExpandPropertyName, '1'); location.reload(); }); observer2.disconnect(); }; let observer2 = new MutationObserver((mutations) =&gt; { mutations.forEach((mutation) =&gt; { if (!mutation.addedNodes) return toggleAutoexpand(mutation); }) }) setTimeout(()=&gt; { observer2.observe($(".shared-eventsviewer")[0], { childList: true , subtree: true , attributes: false , characterData: false }) }, "500"); })</LI-CODE><P><SPAN>------------------<BR /><BR />To refresh the splunk css and js caching use link:&nbsp;<A class="" href="https://ls0pv-splhead-2:8000/en-GB/_bump" target="_blank" rel="noopener">https://yourinstance:8000/en-GB/_bump</A><BR /><BR />On the next splunk update you have to repeat the process if everything remains the same.<BR />I couldn't find any other way.<BR /><BR /></SPAN></P> Tue, 23 Jul 2024 14:21:34 GMT https://community.splunk.com/t5/Splunk-Dev/Auto-expand-a-nested-list-in-a-JSON-log/m-p/694066#M11619 rokxer 2024-07-23T14:21:34Z