Question

I have rows loaded from the database via ajax using jquery. It grabs a php page via ajax, the php page gets the results from the db then returns it back and in jquery I display the results within a div on the webpage. I then have a function that runs every 60 seconds that updates each row, however because the data is loaded via ajax it doesnt “see” the elements needed to run this code every 60 seconds. Here is the code that is giving me the undefined error:

var waitlist_info = $('.currbar').attr('title');

Could I use live with jquery for this to work? If so how would I make it work in this case? I only used live to bind to an action like click.

EDIT

Here is additional code. I added the check to see if there is at least once instance of currbar, however when the code runs the currbar check always is zero until 60 seconds later then it works.

    jQuery.noConflict();

    jQuery(function($) {

        function displayListTimes() {

            if($(".currbar:first").length > 0)
            {

                var list_info = $('.currbar').attr('title');
                var break_info = list_info.split('<>');

                $.ajax({
                    type:"GET",
                    data:'tzone=' + break_info[1],
                    url:"/ajax/time.php",
                    success: function(data) {

                        $('.progress').each(function() {
    //code runs here
                        });

                    }

                });

            }

        };

    var socket = io.connect('http://localhost:2424');

    socket.on('connect', function () {
$.get('/getlist.php', function() {});
    });

    socket.on('message', function (json) {
        var obj = $.parseJSON(json);
        $('#listqueue').html(obj.queuelist);
    });

    displayListTimes();
    setInterval(displayListTimes,60000);

});

Answer 1

Without seeing the rest of the code, you are probably getting this error because the function runs before the page loads the first set of elements.

So you can check if the element exists by using

if($(".currbar:first")[0]){
  var waitlist_info = $('.currbar').attr('title');
}

This will stop you from getting undefined error.

If you are adding html to the page via ajax, you can also use:

jQuery(document).bind("DOMSubtreeModified", function(){
    var waitlist_info = $('.currbar').attr('title');
    //Then do rest of code here
});

This won’t run every 60 seconds, but it will run everytime something gets added to the page.

Also, you can do

jQuery.post("ajax page", {vars:vars}, function(html){
  jQuery("#someelement").append(html);
  var waitlist_info = jQuery(".currbar").attr("title");
  //whatever code you need here
});

Again, this is not every 60 seconds.