Добавить столбец флажка в Handsontable

Question

Вы когда-нибудь делали столбец флажка в Handsontable?

Я стараюсь использовать каждый способ сделать это, но он не работает.

Когда пользователь щелкает флажок в заголовке, все строки в столбце проверяются.

Спасибо за любую помощь.

Answer 1

Вы можете создать столбец флажка, просто установив опцию типа столбца в поле «флажок».

var $container = $("#example1"); 
$container.handsontable({ 
    data: data, 
    startRows: 5, 
    colHeaders: true, 
    minSpareRows: 1, 
    columns: [ 
    {data: "id", type: 'text'}, 
    //'text' is default, you don't actually have to declare it 
    {data: "isActive", type: 'checkbox'}, 
    {data: "date", type: 'date'}, 
    {data: "color", 
     type: 'autocomplete', 
     source: ["yellow", "red", "orange", "green", "blue", "gray", "black", "white"] 
    } 
    ] 
}); 

Более подробно см this example

Answer 2

Там теперь в Handsontable документации и пр checkbox tutorial.

Answer 3

HTML:

<div id="example2" class="handsontable"></div> 

Javascript:

var myData = [{ 
    name: "Marcin", 
    active: true 
}, { 
    name: "Jude", 
    active: false 
}, { 
    name: "Zylbert", 
    active: false 
}, { 
    name: "Henry", 
    active: false 
}] 

var $container = $("#example2"); 
$container.handsontable({ 
    data: myData, 
    rowHeaders: true, 
    columns: [{ 
     data: 'name' 
    }, { 
     type: 'checkbox', 
     data: 'active' 
    }], 
    colHeaders: function (col) { 
     switch (col) { 
      case 0: 
       return "<b>Bold</b> and <em>Beautiful</em>"; 

      case 1: 
       var txt = "<input type='checkbox' class='checker' "; 
       txt += isChecked() ? 'checked="checked"' : ''; 
       txt += "> Select all"; 
       return txt; 
     } 
    } 
}); 

$container.on('mouseup', 'input.checker', function (event) { 
    var current = !$('input.checker').is(':checked'); //returns boolean 
     for (var i = 0, ilen = myData.length; i < ilen; i++) { 
      myData[i].active = current; 
     } 
    $container.handsontable('render'); 
}); 

function isChecked() { 
    for (var i = 0, ilen = myData.length; i < ilen; i++) { 
     if (!myData[i].active) { 
      return false; 
     } 
    } 
    return true; 
} 

Вот пример вы ищете

http://jsfiddle.net/yr2up2w5/

Надеется, что это помогает вам.