jQuery   发布时间:2022-04-19  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了jQuery DataTables Editable – 只读空值大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在使用 jQuery DataTables Editable来编辑表格中的数据. (使用jQuery 1.7.2)数据从Asp.net Web服务获取. (见下面的代码)

当值为空时(例如,如果列表中的一个项目没有类别),我不希望该特定项目的类别可编辑.因此该项目的类别应为只读.我没有办法做到这一点,这可能吗?

<table id="admin_list" celLPADding="0" cellspacing="0" border="0">
    <thead>
        <tr>
            <th>title</th>
            <th>Category</th>
        </tr>                
    </thead>
    <tbody>
    </tbody>
</table>

<script type="text/javascript">
$(document).ready(function () {
    function renderTable(result) {
        var dtData = [];
        $.each(result,function () {
            dtData.push([
                this.title,this.category
            ]);
        });

        $('#admin_list').dataTable({
            'aaData': dtData
        }).makeEditable({
            sReadOnlyCellClass: "read_only",supdateURL:"service.svc/update","aocolumns":
            [
                {},//title
                {} //category
            ]
        });
    }

    $.ajax({
        type: "GET",url: "service.svc/list",dataType: "json",cache: false,data: {},contentType: "application/json; charset=utf-8",success: function (data) {
            renderTable(data.d);
        },error: function (data) {}
    });
});
</script>

解决方法

是的,有一个解决方案.我还提供了 example.

function renderTable(result) {
    var dtData = [];
    $.each(result,function () {
        dtData.push([
            this.title,this.category ? this.category : "&nbsp;"
        ]);
    });

    $('#admin_list').dataTable({
        'aaData': dtData
    }).makeEditable();
}
$.ajax({
    type: "GET",success: function (data) {
        renderTable(data.d);
    },error: function (data) {}
});
​
$("#admin_list tr").live("mousedown",function() {
    console.log($(this).find("td:eq(1)").text());
    if (/^(?:\s+|Click to edit)?$/.test($(this).find("td:eq(1)").text())) {
        $(this)
            .find("td:eq(1)")
            .empty()
            .unbind();
    }
});

大佬总结

以上是大佬教程为你收集整理的jQuery DataTables Editable – 只读空值全部内容,希望文章能够帮你解决jQuery DataTables Editable – 只读空值所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。