Question

I have the following JQuery code that processes a GET request upon page load:

$(document).ready(function() {  
  var refreshId = setInterval(function()
  {
       $('#tweets').fadeOut("slow").fadeIn("slow");
       $.get("/event", { event:$("input[name=event]").val(), }, function(data) {
         console.log(data.success);
         console.log(data.page_link);
         console.log('Succesfully Loaded Data from JSON FORMAT GET');
         $('#tweets').html(data.html);
         $('#pagelink').html(data.page_link);
       });

  }, 30000); 
});

The problem is I would like this GET request to be processed only on a specific page. My application loads all JQuery files at once, in an application.js file. How can I use JQuery to specify, something other than document ready and what would an ideal selector be?

Answer 1

You could add a class to the body tag.

$(document).ready(function() {  
  if ($('body').hasClass('updateTweets')) {
  var refreshId = setInterval(function()
  {
       $('#tweets').fadeOut("slow").fadeIn("slow");
       $.get("/event", { event:$("input[name=event]").val(), }, function(data) {
         console.log(data.success);
         console.log(data.page_link);
         console.log('Succesfully Loaded Data from JSON FORMAT GET');
         $('#tweets').html(data.html);
         $('#pagelink').html(data.page_link);
       });

  }, 30000); 
  }
});