在 JQXgrid 中设置列的 Editable 属性答案

【问题标题】：Setting the Editable property of a column in JQXgrid在 JQXgrid 中设置列的 Editable 属性
【发布时间】：2014-10-07 07:12:59
【问题描述】：

JS：http://jsfiddle.net/tzHXR/

 var data = generatedata(500);
 var source = {
     localdata: data,
     datafields: [{
         name: 'firstname',
         type: 'string'
     }, {
         name: 'lastname',
         type: 'string'
     }, {
         name: 'productname',
         type: 'string'
     }, {
         name: 'date',
         type: 'date'
     }, {
         name: 'quantity',
         type: 'number'
     }, {
         name: 'price',
         type: 'number'
     }],
     datatype: "array"
 };

 var adapter = new $.jqx.dataAdapter(source);
 $("#jqxgrid").jqxGrid({
     width: 500,
     theme: 'energyblue',
     editable: true,
     source: adapter,
     sortable: true,
     columns: [{
         text: 'First Name',
         datafield: 'firstname',
         width: 90,

     }, {
         text: 'Last Name',
         datafield: 'lastname',
         width: 90
     }, {
         text: 'Product',
         datafield: 'productname',
         width: 170
     }, {
         text: 'Order Date',
         datafield: 'date',
         width: 160,
         cellsformat: 'dd-MMMM-yyyy'
     }, {
         text: 'Quantity',
         datafield: 'quantity',
         width: 80,
         cellsalign: 'right'
     }, {
         text: 'Unit Price',
         datafield: 'price',
         cellsalign: 'right',
         cellsformat: 'c2'
     }]
 });

我正在尝试学习 JQXgrid，这是我的 JS 文件。在整个网格中设置为可编辑：真标志，但我希望特定字段不可编辑。

参考jqwidget团队成员http://www.jqwidgets.com/community/topic/making-a-column-non-editable/#post-11055的论坛帖子

我试过这个： JS：http://jsfiddle.net/tzHXR/89/

 var data = generatedata(500);
 var source = {
     localdata: data,
     datafields: [{
         name: 'firstname',
         type: 'string'
     }, {
         name: 'lastname',
         type: 'string'
     }, {
         name: 'productname',
         type: 'string'
     }, {
         name: 'date',
         type: 'date'
     }, {
         name: 'quantity',
         type: 'number'
     }, {
         name: 'price',
         type: 'number'
     }],
     datatype: "array"
 };

 var adapter = new $.jqx.dataAdapter(source);
 $("#jqxgrid").jqxGrid({
     width: 500,
     theme: 'energyblue',
     editable: true,
     source: adapter,
     sortable: true,
     columns: [{
         text: 'First Name',
         datafield: 'firstname',
         width: 90,
         editable:false; // Editable Property Set to false
     }, {
         text: 'Last Name',
         datafield: 'lastname',
         width: 90
     }, {
         text: 'Product',
         datafield: 'productname',
         width: 170
     }, {
         text: 'Order Date',
         datafield: 'date',
         width: 160,
         cellsformat: 'dd-MMMM-yyyy'
     }, {
         text: 'Quantity',
         datafield: 'quantity',
         width: 80,
         cellsalign: 'right'
     }, {
         text: 'Unit Price',
         datafield: 'price',
         cellsalign: 'right',
         cellsformat: 'c2'
     }]
 });

但在此之后，它根本不起作用。它显示的都是空白。我也在我的机器上试过。为什么列的editable:false 会使情况变得更糟。我如何将不可编辑的属性应用到一个确切的列。

【问题讨论】：

标签： javascript jquery html jqxgrid

【解决方案1】：

原因是你应该删除“;”在您的 jQWidgets Grid 的列定义中可编辑后：false。那是语法错误。

【讨论】：