Dashboards & Visualizations

Token update disables JS function for button?

hmaschki
New Member

Hello everyone,

i have some buttons on my page which i want label dynamically depending on a token the user picks from a dropdown menu.
The corresponding labels are saved in a lookup file which i access through javascript. Upon clicking on the buttons a search should be started to write in a kv store.

To this point, everything works just fine.
As soon as i change the token from the dropdown menu, the buttons stop working until i refresh the whole page.
Everything in my js file but the button clicking is still working after the changing of the token.

Here is the code for the buttons I'm using (i also tried "document.getElementById("quickChange0").addEventListener("click"..." but that did not solve the problem) :

$('#quickChange0').click(function () {
            var selected = tokens.get("selected");          
            var doQuickChange1 = "really long search";              

            console.log(doQuickChange1);
            service.search(doQuickChange1);
            setTimeout(function(){location.reload()},1000);             
        });

Does anyone know why this is or has an idea how to do this in a different way?
Thanks in advance!

0 Karma
1 Solution

niketn
Legend

@hmaschki, even if you have created a button in Simple XML code, it should work with Simple XML JS extension where you handle click event in JavaScript. Refer to @jconger 's blog: https://www.splunk.com/blog/2016/09/21/using-html5-input-types-on-splunk-forms.html

Instead of $('#quickChange0').click(function () can you try the following:

$(document).on('click','#quickChange0',function(){
      console.log('quickChange0 Clicked');
       ...
       ...

});
____________________________________________
| makeresults | eval message= "Happy Splunking!!!"

View solution in original post

0 Karma

niketn
Legend

@hmaschki, even if you have created a button in Simple XML code, it should work with Simple XML JS extension where you handle click event in JavaScript. Refer to @jconger 's blog: https://www.splunk.com/blog/2016/09/21/using-html5-input-types-on-splunk-forms.html

Instead of $('#quickChange0').click(function () can you try the following:

$(document).on('click','#quickChange0',function(){
      console.log('quickChange0 Clicked');
       ...
       ...

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

hmaschki
New Member

That works aswell! So you can either use .on('click'...) or define the buttons in js. I would prefer your solution. Thanks!

0 Karma

hmaschki
New Member

The the problem was, that i defined my buttons inside the xml of my dashboard.
Everything is working fine when i use JS to define the buttons.

Problably there is a problem with the way splunk handels IDs when reloading the page upon changing tokens.

0 Karma
Get Updates on the Splunk Community!

Routing logs with Splunk OTel Collector for Kubernetes

The Splunk Distribution of the OpenTelemetry (OTel) Collector is a product that provides a way to ingest ...

Welcome to the Splunk Community!

(view in My Videos) We're so glad you're here! The Splunk Community is place to connect, learn, give back, and ...

Tech Talk | Elevating Digital Service Excellence: The Synergy of Splunk RUM & APM

Elevating Digital Service Excellence: The Synergy of Real User Monitoring and Application Performance ...