How to get local Json file using Ajax in html page using javascript?

Posted by Sangeetha Mani under JavaScript on 5/20/2014 | Points: 10 | Views : 644 | Status : [Member] | Replies : 1
Hi,
As i have tried to acces local json file using ajax in html page using javascript?

but when i click on the button i could not get the updated json data on the textbox.

below mentioned the Html code with javascript and json file


<!Doctype html>

<html>

<head>



<script>

var xmlHttpRequest;



function GetTime()

{

alert("hi");

//create XMLHttpRequest object

xmlHttpRequest = (window.XMLHttpRequest) ?

new XMLHttpRequest() : new ActiveXObject("Msxml2.XMLHTTP");



//If the browser doesn't support Ajax, exit now

if (xmlHttpRequest == null)

return;



//Initiate the XMLHttpRequest object

xmlHttpRequest.open("GET", "Data.json", true);



//Setup the callback function

xmlHttpRequest.onreadystatechange = StateChange;



//Send the Ajax request to the server with the GET data

xmlHttpRequest.send(null);

}

function StateChange()

{

if(xmlHttpRequest.readyState == 4)

{

document.getElementById('lblTime').value = xmlHttpRequest.responseText;

}

}



</script>

</head>

<body>





<form id="form1" runat="server">



<div>

<input type="text" id="lblTime">



<br>

<input type="button" id="btnGetTime" value="Get Time" onclick="GetTime();">



</div>

</form>



</body>

</html>




Data.json file


{"books":

{

"name"":"javascript"



}

}




Please help me , i could not find it out what is my fault in this...

sangeetha.m


Responses

Posted by: Goud.Kv on: 5/21/2014 [Member] [MVP] Gold | Points: 25

Up
0
Down
Hi.,
In your Data.json, remove one double Quotation mark i.e, "name":"javascript".

Hope it works..



Thanks & Regards,
Krishna

Sangeetha Mani, if this helps please login to Mark As Answer. | Alert Moderator

Login to post response