单击复选框时，禁用编辑行-Jquery，Jeditable，Datatable

Question

我在我的项目中使用Jquery，Jeditable和Datatables。

我有一个带有4列动态生成的表。我编写了代码，以便单击时可以编辑Min和max列（第二列和第三列）。第四列“主要区域”是复选框的一列。

我的要求是，当选中此复选框时，我要使行中的相应最小值和最大值不可编辑。

这是我的html

<table id="places" class="display" cellspacing="0" width="50%" >
    <thead>
        <tr>
            <th>Places</th>
            <th>Min Score</th>
            <th>Max Score</th>  
            <th>Main Region</th>
        </tr>                           
    </thead>
    <tbody>                                 
        <% i=0 %>
        <% for scores_place in socres_array %>                                                   
        <tr>
            <td class="readonly" align="center"><%= scores_place.at(0) %></td>  
            <td align="center" class="min"><%= min.at(i) %></td>
            <td align="center" class="max"><%= max.at(i) %></td>            
            <td align='center' class='readonly'><input type='checkbox' class='place_checkbox'></td>             
            <% i=i+1 %>
        </tr>
        <% end %>
    </tbody>                            
</table>

这是我的jquery，它无法按预期工作。

$(document).ready(function() {

    var oTable=$('#places').dataTable({                 
    } );

    //call back function to make min and max editable on click of table cell.

    var theCallback = function(v, s) {
        return v;
    };

    $(oTable).find('td:not(.readonly)').editable(theCallback, {
        "callback": function(sValue, y) {
            var aPos = oTable.fnGetPosition(this);
            oTable.fnUpdate(sValue, aPos[0], aPos[1]);
        },
        "height": "18px",
        "width": "100%"
    });


    //This is not working as expected because of the call back function written above
    $('.place_checkbox').change(function(){

        var row = $(this).closest('tr');
        if($(this).is(':checked'))
        {           
            $(row).find('.min,.max').prop("disabled",true);    

        }
        else
        {
          $(row).find('.min,.max').prop("disabled",false);     
        }
    })
  });

Answer 1

尝试这个

 $(row).find('.min,.max').editable("disable");
 $(row).find('.min,.max').editable("enable");