如何鏈接jqxGrid的2個不同單元格中的複選框

Question

我希望2列的複選框在以下條件成立。

如果「A」上則「B」切換可以是開/關 如果「A」是關閉然後再「B」也必須是關斷

這裏的設定數據的一個例子的小提琴，但我不知道如何才能添加此功能。這基本上只是數據的前端驗證，以防止用戶意外創建「不可能的」場景。我甚至不知道從哪裏開始，如上所述自定義複選框。

https://jsfiddle.net/6rc8uraf/11/

var data = [{ 
    name: "Person1", 
    A: true, 
    B: true 
}, { 
    name: "Person2", 
    A: true, 
    B: false 
}, { 
    name: "Person3", 
    A: false, 
    B: false 
}]; 

var source = { 
    localdata: data, 
    datafields: [{ 
    name: "name", 
    type: "string" 
    }, { 
    name: "A", 
    type: "bool" 
    }, { 
    name: "B", 
    type: "bool" 
    }], 
    datatype: "array" 
}; 

var adapter = new $.jqx.dataAdapter(source); 

$("#jqxgrid").jqxGrid({ 
    width: "100%", 
    source: adapter, 
    editable: true, 
    columnsresize: true, 
    sortable: true, 
    filterable: false, 
    columns: [{ 
    text: "Name", 
    datafield: "name", 
    align: 'center', 
    width: 150, 
    menu: false 
    }, { 
    text: "A", 
    datafield: "A", 
    align: 'center', 
    columntype: 'checkbox', 
    width: 150, 
    editable: true, 
    menu: false 
    }, { 
    text: "B", 
    datafield: "B", 
    align: 'center', 
    columntype: 'checkbox', 
    menu: false, 
    editable: true 
    }] 
}); 

Answer 1

綁定cellendedit事件後Programmatic Editing

$('#jqxgrid').on('cellendedit', function (event) { 
    if (event.args.datafield == 'A' && event.args.value == false) { 
     $("#jqxgrid").jqxGrid('setcellvalue', event.args.rowindex, 'B', false) //set value to false 
     $("#jqxgrid").jqxGrid('setcolumnproperty', 'B', 'editable', false)//disable further editing 
    } else if (event.args.datafield == 'A' && event.args.value == true) { 
     // $("#jqxgrid").jqxGrid('setcellvalue', event.args.rowindex, 'B', true) 
     $("#jqxgrid").jqxGrid('setcolumnproperty', 'B', 'editable', true) //enable editing 
    } 
});