All Apps and Add-ons
Highlighted

How to apply javascript code to xyseries output?

Explorer

I downloaded the Splunk 6.x Dashboard Examples and I was able to get the following to work...

search testString | table host, valueA, valueB

I edited the javascript.js file and .css file that came with the example and everything works GREAT!!!

** When I add the xyseries option to the end of the table command to force the data to display horizontally, the javascript code breaks. **

Are the Table Classes built/read before the xyseries command?

Heres what have:

search testString | table host, valueA, valueB | xyseries  host, valueA, valueB

The table displays properly, but all of my field customizations from the javascript code are missing.

I used the browser's inspect feature and all of the table "ids" and information look correct.

How do you customize fields when using xyseries?

PS: I also tried the chart command after the table command and that didnt work ether.

search testString | table host, valueA, valueB | chart max(Value1)  over host by valueB  
0 Karma
Highlighted

Re: How to apply javascript code to xyseries output?

Explorer

I think I may have found part of the problem. When you use the "table" command it actually creates a HTML tag. When you use the xyseries it creates an id tag but its done with tags instead. So in my example the SplunkJS code is looking for a "" tag but its getting stripped off by the xyseries command.

So now the question is :

Is there a SplunkJS set of commands that will do the same thing and the TableView command set.

I'm looking for something like DivView commands set. This way I can tell the systemm to locate the tage with the "id="blahblah" option.

My only other option is to see if the xyseries command can build its tables using the "real" " HTML tag instead of a bunch of "" tags.

Also if anyone can tell me if raw javascript will work.

Something like this:

function GetElementInsideContainer(containerID, childID) {
var elm = document.getElementById(childID);
var parent = elm ? elm.parentNode : {};
return (parent.id && parent.id === containerID) ? elm : {};
}

var e = GetElementInsideContainer("div1", "edit2");
alert(e.html);

0 Karma