Hello Everyone,
Please suggest how I can fill textarea box from a file located in local drive .
Thanks
If you are using Splunk 6 or the Web Framework, you can convert a dashboard to HTML and read a local file using HTML5/JavaScript.
To select the file, put <input type="file" id="localFileInput">
in the HTML wherever you want the file selection box to be. Then, add some JavaScript just before the closing script tag in your dashboard that handles the contents of the file. You'll need to include something like:
var control = document.getElementById("localFileInput")
add an event listener:
control.addEventListener("change", function(event){...
and inside that function you can use FileReader()
to read the contents of the local file.
EDITED RESPONSE BELOW:
Assuming the user will be selecting the file, try the following:
Select the local file:
<input type="file" id="inputfile"/>
A blank textarea that will be populated by the contents of your text file:
<textarea rows="4" cols="50" id="putcontentshere"></textarea>
The javascript needed to put the contents of the file in the textarea (this goes just above the closing script tag in the body of the html):
//External data file handling starts here
var control = document.getElementById("inputfile");
control.addEventListener("change", function(event){
var reader = new FileReader();
reader.onload = function(event){
var contents = event.target.result;
document.getElementById('putcontentshere').value = contents;
};
reader.onerror = function(event){
console.error("File could not be read! Code " + event.target.error.code);
};
console.log("Filename: " + control.files[0].name);
reader.readAsText(control.files[0]);
}, false);
Simple as that. If you want to do it without the user selecting the file, I think you might be out of luck. Allowing the browser/DOM to access the local file system without user interaction would be a big no-no and isn't allowed (that I know of) without hacking something.
If you are using Splunk 6 or the Web Framework, you can convert a dashboard to HTML and read a local file using HTML5/JavaScript.
To select the file, put <input type="file" id="localFileInput">
in the HTML wherever you want the file selection box to be. Then, add some JavaScript just before the closing script tag in your dashboard that handles the contents of the file. You'll need to include something like:
var control = document.getElementById("localFileInput")
add an event listener:
control.addEventListener("change", function(event){...
and inside that function you can use FileReader()
to read the contents of the local file.
EDITED RESPONSE BELOW:
Assuming the user will be selecting the file, try the following:
Select the local file:
<input type="file" id="inputfile"/>
A blank textarea that will be populated by the contents of your text file:
<textarea rows="4" cols="50" id="putcontentshere"></textarea>
The javascript needed to put the contents of the file in the textarea (this goes just above the closing script tag in the body of the html):
//External data file handling starts here
var control = document.getElementById("inputfile");
control.addEventListener("change", function(event){
var reader = new FileReader();
reader.onload = function(event){
var contents = event.target.result;
document.getElementById('putcontentshere').value = contents;
};
reader.onerror = function(event){
console.error("File could not be read! Code " + event.target.error.code);
};
console.log("Filename: " + control.files[0].name);
reader.readAsText(control.files[0]);
}, false);
Simple as that. If you want to do it without the user selecting the file, I think you might be out of luck. Allowing the browser/DOM to access the local file system without user interaction would be a big no-no and isn't allowed (that I know of) without hacking something.
@gauldridge Thanks it works , thanks allot..
But as you suggest it is not possible without user interaction actually I don't want to show choose file button .
Anyways because of you I achieved this for that thanks again you are awesome...:)
@vikas_gopal Please see my updated/edited response above.
I think your whole issue is that you are attempting to point to a file that is on the filesystem. it must be able to be retrieved via web for this to work.. such as a URL to the text file.
@aelliott I did it but no luck yet.I have added the function after the code.Here is my js code.
require(['jquery','underscore','splunkjs/mvc','splunkjs/mvc/simplexml/ready!'], function($, _, mvc, SimpleSplunkView){
var content ;
function loadXMLDoc();
{
var textfile;
if (window.XMLHttpRequest);
{
textfile = new XMLHttpRequest();
}
textfile.onreadystatechange = function ();
{
if (textfile.readyState == 4 && textfile.status == 200) {
content = textfile.responseText;
}
} textfile.open("GET", "D:\vikas\vikas.txt", true);
textfile.send();
}
});
loadXMLDoc();
you could just add it within your script after it is defined. Just add loadXMLDoc() after the code
@aelliott thanks for the reply.
I tried it as it mentioned in the link.I copied it and paste it in my javascript file .I changd the path accordingly .Now in splunk where I can call this function?so that it picks up the value and shows it to textarea.
@gauldridge Thanks for the reply ,
Unfortunately I am new to javascript and splunk.I found one solution on the following site but it did not work for me.
http://www.sitepoint.com/forums/showthread.php?456093-Read-from-file-then-populate-textarea-with-con....
One way to do this is to create a custom splunkd endpoint that would retrieve the file data and return it's contents by request. Then have your Mako template or Javascript call it and populate the textbox with returned data.