Solved: Javascript save button stuck in a loop

mwdbhyat · ‎03-21-2019

Hi there,

I have a javascript button that saves the input from my dashboard to a lookup using tokens plus a bit of JS extension. The problem im facing is that once I click save for the first time, it keeps "listening" for any movement on the dashboard and continuously saves everything the user clicks on after that until the page is refreshed. Unfortunately I dont speak JS so I was wondering if anyone has come across this issue before?

Here is a sample of what the JS extension script:

require([
"splunkjs/mvc",
"splunkjs/mvc/simplexml/ready!"
], function(
mvc
) {
var defaultTokenModel = mvc.Components.get("default");
var submittedTokenModel = mvc.Components.get("submitted");
$("#saveButton").click(function(){
defaultTokenModel.set("tokSave","true");
submittedTokenModel.set("tokSave","true");
alert("Selected Inputs Saved!");
});
});

Any help would be appreciated..

Thanks!

kamlesh_vaghela · ‎03-22-2019

@mwdbhyat

Issue resolved by updating searchWhenChanged="true" to searchWhenChanged="false".

Issue: Whenever any input changed, the backend search executed, which should be onClick of the button.
Resolution: All inputs having a property searchWhenChanged with true value. In this particular case, onChange event should not be executed when any input change (It will execute search). So we just made it searchWhenChanged=false.

Example:

 <fieldset submitButton="false">
    <input type="dropdown" token="field1" searchWhenChanged="true">
      <label>field1</label>
    </input>
  </fieldset>

Thanks
Happy Splunking

View solution in original post

kamlesh_vaghela · ‎03-22-2019

@mwdbhyat

Issue resolved by updating searchWhenChanged="true" to searchWhenChanged="false".

Issue: Whenever any input changed, the backend search executed, which should be onClick of the button.
Resolution: All inputs having a property searchWhenChanged with true value. In this particular case, onChange event should not be executed when any input change (It will execute search). So we just made it searchWhenChanged=false.

Example:

 <fieldset submitButton="false">
    <input type="dropdown" token="field1" searchWhenChanged="true">
      <label>field1</label>
    </input>
  </fieldset>

Thanks
Happy Splunking

mwdbhyat · ‎03-22-2019

Thanks alot for the help!!

kamlesh_vaghela · ‎03-21-2019

@mwdbhyat

I have tried your code and it is working. So for reproducing an issue please share more information OR scenario.

Sharing my code with another block of code with fieldset button.

<form script="my.js">
  <label>Submit Button</label>
  <fieldset submitButton="true" autoRun="false">
    <input type="text" token="field1">
      <label>field1</label>
    </input>
  </fieldset>
  <row>
    <panel>
      <title>$tokSave$</title>
      <html>
        <input type="button" id="saveButton" value="Save"/>
      </html>
    </panel>
  </row>
</form>

my.js

require([
        "splunkjs/mvc",
        "splunkjs/mvc/simplexml/ready!"
    ], function (
        mvc) {
    var defaultTokenModel = mvc.Components.get("default");
    var submittedTokenModel = mvc.Components.get("submitted");

    //HTML button
    $("#saveButton").click(function () {
        defaultTokenModel.set("tokSave", "Clicked saveButton");
        submittedTokenModel.set("tokSave", "Clicked saveButton");
        alert("Selected Inputs Saved!");
    });


    // fieldset button
    $(".btn.btn-primary").on("click", function (e) {
        e.preventDefault();
        defaultTokenModel.set("tokSave", "Clicked fieldset button");
        submittedTokenModel.set("tokSave", "Clicked fieldset button");
        return false;
    });
});

mwdbhyat · ‎03-22-2019

@kamlesh_vaghela thanks for getting back to me!

Its not so much that it doesnt work - it is saving stuff, the problem is that it saves continuously - so if i click save once, it will always save everything while im working on the dashboard until I hit the refresh button - this is not the behaviour I want.. I only want it to save stuff when I click the save button each time and then stop saving straight after. The reason for this is that im dumping the saves to a lookupfile which then gets re-read into the dashboard.. so obviously if it keeps continuously saving stuff without my input it will be saving the wrong thing and overcrowding the csv(its appending).

mwdbhyat · ‎03-22-2019

Here is a portion of the xml

dashboard

 <query>| inputlookup "savename".csv where reading="$reading$" |tail 1
 | table reading periodCutter stdevLoTolerance stdevHiTolerance timeRange_earliest timeRange_latest
 </query>
 <done>
   <condition match="$job.resultCount$!=0">
     <set token="form.timeRange.earliest">$result.timeRange_earliest$</set>
     <set token="form.timeRange.latest">$result.timeRange_latest$</set>
     <set token="form.reading">$result.reading$</set>
     <set token="form.periodCutter">$result.periodCutter$</set>
     <set token="form.stdevLoTolerance">$result.stdevLoTolerance$</set>
     <set token="form.stdevHiTolerance">$result.stdevHiTolerance$</set>
     <set token="timeRange.earliest">$result.timeRange_earliest$</set>
     <set token="timeRange.latest">$result.timeRange_latest$</set>
     <set token="reading">$result.reading$</set>
     <set token="periodCutter">$result.periodCutter$</set>
     <set token="stdevLoTolerance">$result.stdevLoTolerance$</set>
     <set token="stdevHiTolerance">$result.stdevHiTolerance$</set>
     </condition>
 </done>


 <query>| makeresults

kamlesh_vaghela · ‎03-22-2019

@mwdbhyat

Can you please add submittedTokenModel.set(defaultTokenModel.toJSON()); in javascript click function and try it??

//HTML button
$("#saveButton").click(function () {
    defaultTokenModel.set("tokSave", "Clicked saveButton");
    submittedTokenModel.set("tokSave", "Clicked saveButton");
    submittedTokenModel.set(defaultTokenModel.toJSON());
    alert("Selected Inputs Saved!");
});

mwdbhyat · ‎03-22-2019

@kamlesh_vaghela no joy - still does the infinity save loop 😕 .. my thoughts are that it must just be endlessly running the outputlookup one tokSave is clicked. I cant see anything int he console that implies its constantly running. Could it be a splunk process?

kamlesh_vaghela · ‎03-22-2019

@mwdbhyat I'm unable to reproduce issue with the inputlookup and outputlookup searches. And how you see the endlessly running the outputlookup after click. Can you please share screenshot OR gif??

Do you see anything in network urls ??

kamlesh_vaghela · ‎03-22-2019

@mwdbhyat

I have added an answer which derived from our last troubleshooting call. Kindly accept and upvote my comments which are useful to you too for troubleshooting or learning.

Thanks

Javascript save button stuck in a loop

Welcome to the Splunk Community!

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

Adoption of RUM and APM at Splunk