0

我有两种代码变体,每种变体都有一个期望的行为和一个不期望的行为......但我不明白为什么会发生这种情况,或者如何将它们结合起来以获得两种期望的行为。(我尝试了 if/else 语句的不同变体,试图在一个代码中同时获得所需的两种行为,但到目前为止我还没有成功。

变体 1:http: //jsfiddle.net/crashvector/q81m7sab/15/

正确行为:您可以选择一行,更改出现的下拉菜单(下拉值写入表),然后您可以取消选择该行。(check-uncheck 列从 1 更新为 0。)

不良行为:您可以选择一行,然后立即取消选择它。check-uncheck 列从 1 更新为 0,下拉菜单不会将其当前值写入表并消失。

}).on('deselect', function (e, dt, type) {
    var dt_indexes = dt[0]
    if (type === 'row') { 
      $.each( dt_indexes, function ( index ) {
        var row = dataTable.row( dt_indexes[index] );

        if(!Category && !Category.length) {
        writeCell($(row.node()).find('select'));
        };

        toggleDataAndDraw(row, type, 0); 
     } );     
    }
    dataTable.draw();
  });
var writeCell = dropdown => {
        var currentRow = dataTable.row(dropdown.closest('tr'));
        var rowData = currentRow.data();
        rowData.Category = dropdown.val();
        $(currentRow.node()).find('td:eq(6)').html( 
          currentRow.data().Category
        );
        currentRow.draw();
      };

变体 2:http: //jsfiddle.net/crashvector/q81m7sab/16/

正确行为:您可以选择一行,然后立即取消选择它。check-uncheck 列从 1 更新为 0,下拉值写入表并消失。

不良行为:您可以选择一行,更改出现的下拉菜单(下拉值写入表),然后您可以取消选择该行。但是检查-取消检查列不会从 1 更新为 0。

}).on('deselect', function (e, dt, type) {
    var dt_indexes = dt[0]
    if (type === 'row') { 
      $.each( dt_indexes, function ( index ) {
        var row = dataTable.row( dt_indexes[index] );

        //if(!Category && !Category.length) {
        writeCell($(row.node()).find('select'));
        //};

        toggleDataAndDraw(row, type, 0); 
     } );     
    }
    dataTable.draw();
  });

var writeCell = dropdown => {
    var currentRow = dataTable.row(dropdown.closest('tr'));
    var rowData = currentRow.data();
    rowData.Category = dropdown.val();
    $(currentRow.node()).find('td:eq(6)').html( 
      currentRow.data().Category
    );
    currentRow.draw();
  };

END GOAL一种既具有正确行为又没有不良行为的功能。

4

1 回答 1

1

从您的 jsFiddle “变体 1” ...只需更改条件(在第 #222 行):

if(!Category && !Category.length) {

至:

if($(row.node()).find('select').length){

writeCell()因此,如果<select>当用户取消选中该行时它仍然存在,它将执行。

于 2019-04-20T13:17:38.493 回答