如何使複選框保持谷歌可視化表中的複選框狀態

Question

我正在使用谷歌可視化表並在列表中添加複選框。我想用複選框選擇一些行並對這些選定的行執行一些操作。但是，當調用sort或page事件時，將重繪表格並取消選中複選框。

Here is the fiddle

我怎樣才能保持複選框狀態表進行排序或頁面改變後？

謝謝

Answer 1

事件被調用之前，你可以做這樣的事情，以節省您的複選框的checked狀態：

var checkboxes = document.querySelectorAll("#table_div input[type=checkbox"); 
    var checkboxesState = {}; 
    for (var i = 0; i < checkboxes.length; i++) { 
    checkboxes[i].addEventListener("change", function(){ 
     checkboxesState[this.getAttribute("id")] = this.checked; 
    }); 
    } 

，而該事件被稱爲後，將其還原：

google.visualization.events.addListener(table, 'sort', function(ev) { 
     //Needed, since the whole table DOM will change 
     checkboxes = document.querySelectorAll("#table_div input[type=checkbox"); 
      for (var i = 0; i < checkboxes.length; i++) { 
      if (checkboxesState[checkboxes[i].getAttribute("id")]){ 
       checkboxes[i].checked = checkboxesState[checkboxes[i].getAttribute("id")]; 
      } 
      } 
    });