how to load xml file to jsp/html page using javascript/jquery - javascript

I have an xml file created in E drive E:\xmlData.xml.
I need to load this xml file into jsp/html file on page load using JavaScript/jQuery.

Generally speaking JavaScript is client-side technology. It doesn't have access to your local file system and you can't load a file from there. But HTML5 provides the File System API. It allows you to solve your issue. Here's an example.

Create a Rest API based server. which will return the xml when the request is given by an Ajax call.

jQuery provides a method $.get which can capture the data from a URL. So to "read" the xml document, it needs to be accessible through a URL.
for using jQuery you must download jQuery javascript library from http://jquery.com/
and put it on the current project/solution file.
use this inside the head tag :
<script src="jquery-1.7.2.min.js" type="text/javascript"></script>
This is an example script this will alert xml file content on load...
<script type="text/javascript">
var localFileUrl = '/Yourdirectory/file.xml';
$(document).ready(function() {
$.get(localFileUrl , function(fileContent) {
alert(fileContent);
});
});
</script>

Related

JavaScript file doesn't effect new file imported via jquery load() method

I have a file index.php and there is a main js script in its header.
I'm using Jquery load method to load other php file inside a div element:
$("#formHideinAjax").load('loginpass.php');
And as our friend explained here the main js file which had loaded in the header doesn't work in new imported file so I was forced to add the js file inside the loginpass.php too(Now I have two same js file, one in header and one in div that loads loginpass.php ! )
I know that this method of loading js file is not standard and sends more request to my server.
How can I fix this problem?
Well, it is explicitly said in $.load() documentation. I'm afraid you can't just paste <script></script> code into your DOM for browser to run it.
I'm afraid you have to send JavaScript code from your loginpass.php file (without <script></script> tags) and just eval it in your JavaScript
$("#formHideinAjax").load('loginpass.php', function () {
// eval JavaScript code from php file here
});

Load JavaScript file source code as plain text and access its content using JavaScript

Is it possible to download a script file using the script tag like this
<script src="http://webserver.com/script.js"></script>
and then be able to read the loaded file content with JavaScript, like this for example:
var scriptContent = window.scripts[0].content;
What i came to notice is that the loaded JavaScript file contents is not accessible by other JavaScript files or am i wrong ?
No, it is not possible to do that.
The source code of a script loaded via src is not exposed via any API made available to JavaScript running in the page.
You could read the value of src and then fetch it using XMLHttpRequest.
The source code of specific functions may be available by calling toString() on them.

how to instantiate a js object from .json file

I have included my json file like this
<script type="text/javascript" src="slideshows/1/myfile.json"></script>
And I wonder how I can now create a js object from this file?
If the json was defined inline, or defined in a .js-file it would already have a variable connected to it, but how does it work now that it is in a separate json file?
A JSON file is not a script. It is data.
You need to use a data access method, such as jQuery's $.getJSON() to get it.
Using script tags to import JSON in the page has only on useful use case, which is a way to prevent Cross-origin security issue from happening. We use it as JSONP in JavaScript by sending a callback attribute on the query-string:
<script type="text/javascript"">
window.getMyJSON = function(json){
};
</script>
<script type="text/javascript"
src="http://someotherdomain/slideshows/1/myfile.json?callback=getMyJSON">
</script>
BUT it seems here the JSON file is located just on the current domain, so as #Scimonster has pointed out you can simply achieve it using $.getJSON().

getting the content of script file using a local javascript

similiar How can I get the content of the file specified as the 'src' of a <script> tag? and Getting content of a script file using Javascript , I want to use script tag to load xml files for the use of a javascript code - only I need it to run locally.
so how can I access the content of the files loaded using script tag?
You can not achieve this one locally.
Loading the script will execute it and won't give you access to the src
so then the only option you would have is to load the file as an ajax call. But ajax calls don't work locally (due to security) .

google.load search <script>

What does the following do
google.load("search", "1");
Can i access this directly via a <script/> tag.
This is part of the Google Loader service, which allows a JavaScript script to load other common JS script (in this case, the Google AJAX Search API I believe).

Categories

Resources