2015-11-02 291 views
1

有誰知道如何通過檢查特定行的第一個複選框來選擇(檢查)在handontable行中的所有複選框。我嘗試了所有可能的方法來完成它,但我無法通過任何方式來完成它。如何選擇所有複選框在handsontable

下面是代碼,

function getCarData() { 
    return [ 
     { available: true,available2: true,available3: true, comesInBlack: 'yes'}, 
     {available: false,available2: true,available3: true,available3: true, comesInBlack: 'yes'}, 
     { available: true,available2: true,available3: true, comesInBlack: 'no'}, 
     {available: false,available2: true,available3: true, comesInBlack: 'yes'}, 
     { available: false,available2: true,available3: true, comesInBlack: 'no'} 
    ]; 
    } 

    var example1 = document.getElementById('example1'), 
    hot1; 

    hot1 = new Handsontable(example1, { 
    data: getCarData(), 
    colHeaders: ['Available','Available2','Available3'], 
    columns: [ 

     { 
     data: 'available', 
     type: 'checkbox' 
     },{ 
     data: 'available2', 
     type: 'checkbox' 
     },{ 
     data: 'available3', 
     type: 'checkbox' 
     } 
    ] 
    }); 

這裏是的jsfiddle鏈接 jsfiddle.net/mq5on8qf

+0

你的小提琴似乎不完整... theres什麼都不檢查在div。你能完成html,然後我們可以幫你 –

+0

鏈接非SSL小提琴,以防止安全錯誤:http://jsfiddle.net/mq5on8qf/ – myf

+0

@Simon價格,因爲myf建議我改變了鏈接,你能請現在檢查? –

回答

1

你可以做的是增加一個afterChange事件,檢查第一列的變化,如果是,則將該行上列的值設置爲新值。這裏是這樣一個事件的實現:

afterChange: function (changes, source) { 
    var change = changes[0]; // [row, prop, oldVal, newVal] 
    var row = change[0]; 
    var data = this.getData(); // reference to data object 
    var newVal = change[3]; 
    var col = change[1]; 

    // conditional on first row 
    if (col === 'available') { 
     data[row].available2 = newVal; 
     data[row].available3 = newVal; 
    } 
    this.render(); // render after making changes to data 
} 

here is your fiddle與它一起應用。

+0

感謝您的解決方案:) –