Dashboards & Visualizations

SimpleXML extensions: How to customize my dashboard so that it can submit a form by clicking on a custom link?

gschr
Path Finder

Hi all,

I'm trying to expand my dashboard in a way that I don't need a submit Button anymore. Or let's better say, I still want it but in a different appearance.

Just look at this example code for a dashboard:

<form script="test_submit.js">
  <label>test_submitform</label>
  <fieldset submitButton="true">
    <input type="text" token="field1">
      <label>field1</label>
    </input>
  </fieldset>
  <row>
    <panel>
      <html>
        <a id="mysubmit">submit</a>
      </html>
    </panel>
  </row>
  <row>
    <panel>
      <table>
        <search>
          <query>| makeresults | eval field1="$field1$" | table field1</query>
          <earliest>0</earliest>
          <latest></latest>
        </search>
      </table>
    </panel>
  </row>
</form>

It is basically a dashboard (form) with one text input field that sets the token $field1$. The token is set after I click on the submit Button. Now I don't want to click the submit button but the Link in the HTML element instead.

I expanded my dashboard with some JavaScript code according to http://dev.splunk.com/view/SP-CAAAE4A . The code (test_submit.js) looks like this:

require([
        "jquery",
        "splunkjs/mvc/simpleform/formutils",
        "splunkjs/mvc/simplexml/ready!"
], function ($,FormUtils) {
    $("#mysubmit").on("click", function () {
        FormUtils.submitForm();
    });
});

This code worked in Splunk 6.4. Now in Splunk 6.5.0 it gives me the following error:

Chrome:

common.js:179 Uncaught TypeError: Cannot read property 'apply' of undefined

Firefox:

TypeError: (intermediate value).apply is undefined

Is this is bug in Splunk or in my code? And how can I work around this?

1 Solution

rjthibod
Champion

I would suggest going about this in JS without relying on the FormUtils class and edit the token values directly using the token models. The code would be as follows:

require([
    'underscore',
    'jquery',
    "splunkjs/mvc",
    "splunkjs/ready!",
    "splunkjs/mvc/simplexml/ready!",
  ], function(_, $, mvc) {

  function submitTokens() {
    var submittedTokens = mvc.Components.get('submitted');
    var defaultTokens = mvc.Components.get('default');
    if (submittedTokens && defaultTokens) {
      submittedTokens.set(defaultTokens.toJSON());
    }
  }   

  $("#mysubmit").on("click", function () {
    submitTokens();
  });
});

View solution in original post

0 Karma

rjthibod
Champion

I would suggest going about this in JS without relying on the FormUtils class and edit the token values directly using the token models. The code would be as follows:

require([
    'underscore',
    'jquery',
    "splunkjs/mvc",
    "splunkjs/ready!",
    "splunkjs/mvc/simplexml/ready!",
  ], function(_, $, mvc) {

  function submitTokens() {
    var submittedTokens = mvc.Components.get('submitted');
    var defaultTokens = mvc.Components.get('default');
    if (submittedTokens && defaultTokens) {
      submittedTokens.set(defaultTokens.toJSON());
    }
  }   

  $("#mysubmit").on("click", function () {
    submitTokens();
  });
});
0 Karma

gschr
Path Finder

Thank you rjthibod. I guess that works for me.

0 Karma

rjthibod
Champion

Sorry I couldn't give you a more direct answer to the exact cause of your problem. I made my recommendation because I know it works, and I always favor using the most direct mechanisms to deal with token and input classes given their consistency in 6.x. The wrapper-like classes like FormUtils seem to be more likely to change across versions.

0 Karma
Get Updates on the Splunk Community!

Index This | I am a number, but when you add ‘G’ to me, I go away. What number am I?

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

What’s New in Splunk App for PCI Compliance 5.3.1?

The Splunk App for PCI Compliance allows customers to extend the power of their existing Splunk solution with ...

Extending Observability Content to Splunk Cloud

Register to join us !   In this Extending Observability Content to Splunk Cloud Tech Talk, you'll see how to ...