[jQuery] Linking rows on a dynamically generated table
Hi All --
I'm a bit new to Jquery, but I've been using it for the past few days
and have really come to take a shining to it. However, recently I've
run into an issue when trying to build a table w/ different links
specified on each row.
Here's my code:
for (var i = 0; i < surveys.length; i++) {
var cells = new Array(4);
var row = document.createElement ( 'tr' );
var sid = surveys[i].survey_id;
for(var j = 0; j < cells.length; j++)
cells[j] = document.createElement( 'td' );
$(cells[0]).append(surveys[i].survey_name);
$(cells[1]).append(sid);
$(cells[2]).append(surveys[i].created_date);
$(cells[3]).append(surveys[i].completed_date);
$
(row).append(cells[0]).append(cells[1]).append(cells[2]).append(cells[3])
.click(function(){
window.location.href = '/view?id=' + sid;
});
$('#history-table').append(row)
}
What seems to happen is that each call to the .click() event sets a
handler for all rows instead of the one row element that I'm
specifying, and so each row links to the last URL generated instead of
each row pointing to a different URL.
Am I missing something here?