Back in the older Splunk days, I was able to configure a dashboard panel to allow a user the ability to click on the panel and go to another URL, using code similar to this in my dashboard XML:
<div class="dashboard-panel" onclick="urlrd('http://www.xyz.com');">
<script type="text/javascript">
function urlrd(dest_url){
window.location.href = dest_url;}
</script>
I'm currently working on a dashboard that uses a PNG image as a background, with div tags used to define an area on the background (a rectangle) that will change color based on input read from a lookup table. The idea is for the consumer to click on the rectangle in order to be directed to a URL with more information; I'm just at the "demo" stage right now.
Here's a sample of the XML code I'm using:
<form stylesheet="alpha.css" refresh="30" script="drilldown.js">
<label>Dashboard Test</label>
<fieldset submitButton="false" autoRun="true">
<input type="time" token="field1" searchWhenChanged="false">
<label></label>
<default>
<earliest>rt-1m</earliest>
<latest>rt</latest>
</default>
</input>
</fieldset>
<row>
<panel id="image_panel">
<search>
<query>| inputlookup data.csv | head 1 | table value color_value</query>
<earliest>0</earliest>
<progress>
<set token="color_alpha">$result.color_value$</set>
</progress>
</search>
<html>
<div id="alpha" class="singleValue" style="color: $color_alpha$; background-color: $color_alpha$; width: 155px; height: 70px; top: 218px; left: 210px; cursor: pointer"/>
</html>
</panel>
</row>
</form>
I am using this code for my JavaScript (called "drilldown.js"):
var components = [
"splunkjs/ready!",
"splunkjs/mvc/simplexml/ready!",
"jquery"
];
require(components, function(
mvc,
ignored,
$
) {
$('#alpha').click(function() {
window.open(
'http://www.google.com',
'_blank'
);
});
});
While the background and singleValue "rectangle" work correctly on the dashboard, my configuration attempts to make the rectangle "clickable" in order to go to Google are not successful.
What to I need to tweak (or add) in order to make the click event successful?
... View more