Question

I am using full calendar and when we click on next month/year all table’s td field is refreshed.

When all data is refreshed I also want that the onClick should also get the new data.

The code for refreshing is below

 function updateCells(firstTime) {
//alert('called');
var startYear = t.start.getFullYear();
var today = clearTime(new Date());
var cell;
var date;
var row;
subTables.each(function(i, _sub){
var d = cloneDate(t.start);
d.setFullYear(d.getFullYear(),i,1);
d.setFullYear(d.getFullYear(),i,1-d.getDay());
$(_sub).find('td').each(function(ii, _cell) {

    cell = $(_cell);
    if (d.getMonth() == i) {
        cell.removeClass('fc-other-month');
    }else{
        cell.addClass('fc-other-month');
    }
    if (+d == +today && d.getMonth() == i) {
        cell.addClass(tm + '-state-highlight fc-today');
    }else{
        cell.removeClass(tm + '-state-highlight fc-today');
    }
    cell.find('div.fc-day-number').text(d.getDate());
    cell.find('div.fc-day-number').setAttribute('onClick','clicked("' + d.getDate() + '"');
    //document.getElementsByTagName('div.fc-day-number').setAttribute('onClick','clicked("' + d.getDate() + '"');
    addDays(d, 1);
});
});
bodyRows.filter('.fc-year-have-event').removeClass('fc-year-have-event');
 }

The error is

TypeError: document.getElementsByTagName(...).setAttribute is not a function

Does anybody knows how to set the new data in onClick event.

Answer 1

The getElementsByTagName() function returns a NodeList, which is a collection of nodes, so you’ll need to iterate over it and act on each one separately.

var nodes = document.getElementsByTagName(...);
for(var i = 0; i < nodes.length; i++) {
    var node = nodes[i];
    node.setAttribute(...);
}

Though I don’t believe that function is designed or intended to work with a full selector, only a tag name (so 'div' and not 'div.fc-day-number').

You could, instead, do it this way:

cell.find('div.fc-day-number').off('click').click(function(e) {
   clicked(d.getDate());
});