I am new to ajax and jquery. I am trying to load a simple .txt file into a div for testing purpose right now. But i keep getting an error(undefined). I the txt file and the html files are in the same directory. I even tried giving the full path but dint work. Below is my code snippet
<html>
<script type = "text/javascript"
src = "http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script
<body>
<link rel = "stylesheet" href = "shop.css">
<div id = "header">
<p id = "welcome"> SHOPPINGCART.COM </p>
</div>
<div id = "container">
hi
<div class = "image">
<div class = "pic">
<img src ="images/item.jpg">
</div>
<div class = "label">
<p1> Item 1 </p1>
<p2> Price </p2>
<button type = "button" class = "add">
Add
</button>
</div>
</div>
<div class = "image">
<div class = "pic">
<img src ="images/item.jpg">
</div>
<div class = "label">
<p1> Item 1 </p1>
<p2> Price </p2>
<button type = "button" class = "add">
Add
</button>
</div>
<script>
$("button").click(function(event) {
$("#welcome").load("test.txt", function(responseTxt, statusTxt, xhr) {
if (statusTxt == "success")
alert("External content loaded successfully!");
if (statusTxt == "error")
alert("Error: " + xhr.status + ": " + xhr.responseTxt);
});
//$(event.target).html("Added");
});
</script>
</body>
</html>
