Question

使用datatables和jeditable插件。每当我使用这个选择器：。$（'td [class！=“readonly”]'）我无法进行内联编辑。如果我注释掉选择器，那么一切都很好。我不想因为明显的原因而编辑复选框列。

任何帮助？

谢谢！

这是我的初学者。

$(document).ready(function() {
    $('#example').dataTable({
        "sAjaxSource": "js/DataTables-1.9.0/scripts/server_processing.php",
                "aoColumns": [
                            {"bVisible": false },//id                                                                                               
                            {},//code
                            {},//project
                            {},//task
                            {},//type
                            {},//description
                            {"fnRender": function (oObj) {
                                return "<input type='checkbox' class='readonly' value='" + oObj.aData[0] + "' name='check'>";
                                },
                            "sClass": "readonly",
                            "bSearchable": false,
                            "bSortable": false
                            }//checkbox
                            ]

                })
                .$('td[class!="readonly"]')
                .makeEditable({
                    "sUpdateURL": "js/DataTables-1.9.0/scripts/server_editing.php"
            })
        } );

这是我的表：

<table cellpadding="0" cellspacing="0" border="0" class="display" id="example">
<thead>
    <tr>
        <th width="2%">ID</th>                  
        <th width="10%">Code</th>
        <th width="10%">Project</th>
        <th width="10%">Task</th>
        <th width="10%">Type</th>
        <th width="50%">Description</th>
        <th width="2%">Delete</th>
    </tr>
</thead>
<tbody>
    <tr>
        <td class="dataTables_empty">Loading data from server</td>
        <td class="dataTables_empty">Loading data from server</td>
        <td class="dataTables_empty">Loading data from server</td>
        <td class="dataTables_empty">Loading data from server</td>
        <td class="dataTables_empty">Loading data from server</td>
        <td class="dataTables_empty">Loading data from server</td>
        <td align="center" class="readonly">Loading data from server</td>
    </tr>
</tbody>
<tfoot>
    <tr>
        <th>ID</th>              
        <th>Code</th>
        <th>Project</th>
        <th>Task</th>
        <th>Type</th>
        <th>Description</th>
        <th>Delete</th>   
    </tr>
</tfoot>

修改

感谢语法帮助每个人。

我把它改成了这个，但仍然没有骰子？再次，删除选择器内联编辑工作。??

$(document).ready(function() {
    $('#example').dataTable({options});
    $('td').each(function(){
        var self = $(this);
        if(self.hasClass("readonly") != true){
            self.makeEditable({"sUpdateURL": "js/DataTables-1.9.0/scripts/server_editing.php"})
        }
    });
});

Answer 1

尝试使用$().hasClass();

你不应该将它们串在一起，jquery元素不是另一个的方法或属性...我很惊讶它也适用于选择器被删除...试试这个：

$(document).ready(function() {
    $('#example').dataTable({
       "sAjaxSource": "js/DataTables-1.9.0/scripts/server_processing.php",
       "aoColumns": [
          {"bVisible": false},//id     
          {},//code
          {},//project
          {},//task
          {},//type
          {},//description
         {"fnRender": function (oObj) {
               return "<input type='checkbox' class='readonly' value='" + oObj.aData[0] + "' name='check'>";
         },
        "sClass": "readonly",
        "bSearchable": false,
        "bSortable": false
        }//checkbox
     ]

    });
    $('td').each(function(){
        var self = $(this);
        if(self.hasClass("readonly") != true){
            self.makeEditable({"sUpdateURL": "js/DataTables-1.9.0/scripts/server_editing.php"})
         }
    });
});

Answer 2

你正在以错误的方式使用链接：

$('#example').dataTable(options)
  .find('td[class!="readonly"]')
  .makeEditable(options);

// Next code is probably lead to error due to fact that $ isn't exists
// in result of dataTable function, thus leading to makeEditable not run...
$('#example').dataTable(options)
  .$('td[class!="readonly"]')
  .makeEditable(options);

Answer 3

改变这个：

$('#example').dataTable(options)
     .$('td[class!="readonly"]')
     .makeEditable(options);

进入这个：

$('#example').dataTable(options)
     .$('td').not(".readonly")
     .makeEditable(options);

jquery .makeEditable选择器

3 个答案: