4

テーブルの各列には、クリックすると列全体が選択されるアイコンが必要です。ボタンのある最初の(固定されていない)列でこれを機能させていますが、各アイコンを機能させることができません。また、最後の列 (2018) の幅が広く、水平スクロールが最後に達しないように見える理由はありますか? 前もって感謝します。

jQuery

container.handsontable("loadData", getData());

$("button#selectFirst").on('click', function () {
    //container.handsontable("selectCell", 0, 4)
    container.handsontable("selectCell", 0, 4, 5, 4)
});

http://jsfiddle.net/D4Kx3/5/

4

1 に答える 1

1

このような矢印のカスタムレンダラーを追加する必要があります

var myRendererArrow = function (instance, td, row, col, prop, value, cellProperties) {
    Handsontable.cellTypes.checkbox.renderer.apply(this, arguments);
    $(td).empty().append("<span class='sm-moon delBlue icon-right-arrow-17' data-icon='&#xe795;'>O</span>");
    return td;
};      

afterRender コールバックで、このコードを追加する必要があります

afterRender:function(){
    $('input[type=checkbox]').uniform(); 
    $('.checkall').on('click', function () {
        $(this).closest('table').find('input.htCheckboxRendererInput').prop("checked",this.checked);
        $.uniform.update();//update UniformJS
    });
//select clicked column
$(".icon-down-arrow-17").on("click",function(){
    var col=$(this).closest("th").index();
    container.handsontable("selectCell", 0, col, 5, col);
}); 
//select row only change th for tr and the column on selectCell
$(".icon-right-arrow-17").on("click",function(){
    var row=$(this).closest("tr").index();
    container.handsontable("selectCell", row, 0, row, 13,false);//false prevent scroll
});                  
}    

値が変更された場合にのみ背景色を変更するには、 afterChange 内で changes オブジェクトを使用できます

$('#example1').handsontable('getInstance').addHook('afterChange', function(changes) {
    var ele=this;
    $.each(changes, function (index, element) {
        if(element[2]!=element[3]){    //if the original value is not equal to the actual 
               $(ele.getCell(element[0],ele.propToCol(element[1])))
                    .addClass('changeInput').data("change",true);
        }
    });
});    

http://jsfiddle.net/D4Kx3/10/

于 2013-10-23T14:35:07.580 に答える