?
Solved

Jquery Load function does not work

Posted on 2013-10-25
4
Medium Priority
?
744 Views
Last Modified: 2013-10-25
I have this code:

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $("#div1").load("./a.txt");
  });
});
</script>
</head>
<body>

<div id="div1"><h2>Let jQuery AJAX Change This Text2</h2></div>
<button>Get External Data</button>

</body>
</html>

Open in new window

enter code here
But after clicking on button nothing happens. I also tried load("/a.txt"); Still no luck.

Tried different browsers, no success.

*Update*:

====================================================

I managed to resolve the above issue(partially) by putting the files inside the Web server.

Now I have another related issue. Button that runs Jquery only seem to work only once. That is when I change the contents of the text file and click on the Button I always see the text of the old file. I suppose browser caches Jquery loaded data?
0
Comment
Question by:unknown_routine
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
4 Comments
 
LVL 33

Assisted Solution

by:Big Monty
Big Monty earned 1000 total points
ID: 39601044
try adding a random querystring to the URL to prevent caching:

$("#div1").load("./a.txt?" + (new Date()).getTime());
0
 
LVL 58

Expert Comment

by:Gary
ID: 39601061
Any reason to use a text file? If you use a .php extension (even though it is just text) it will not be cached unlike txt files which are seen as static files (never changing)

How is the a.txt changing from when you previously click the button? (and I don't mean just by you changing it)

Or you could call a single php file that includes the txt file.
0
 
LVL 44

Accepted Solution

by:
Chris Stanyon earned 1000 total points
ID: 39601319
The jQuery load() function is simply a shorthand method for an AJAX request. If you want more control than the shorthand syntax offers (i.e disabling caching) then you're going to need to use the full version, not the shorthand:

$("button").click(function(){
   $.ajax( {
      url: "./a.txt",
      cache: false,
      success: function(html) {
         $("#div1").html(html);
      }
   });
});

Open in new window

0

Featured Post

Windows Server 2016: All you need to know

Learn about Hyper-V features that increase functionality and usability of Microsoft Windows Server 2016. Also, throughout this eBook, you’ll find some basic PowerShell examples that will help you leverage the scripts in your environments!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses how to create an extensible mechanism for linked drop downs.
The article shows the basic steps of integrating an HTML theme template into an ASP.NET MVC project
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

650 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question