2014-10-07 79 views
1

JS:http://jsfiddle.net/tzHXR/在JQXgrid設置列的可編輯屬性

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列的更糟糕。我如何將不可編輯的屬性應用於一個確切的列。

回答

2

原因是你應該刪除「;」在jQWidgets Grid的列定義中可編輯:false後。這是一個語法錯誤。

+0

謝謝。我弄錯了。 – 2014-10-07 08:24:17

相關問題