<div id="GridEdit"></div>
<script type="text/javascript">
$(function () {
var data = [
{ Id: 1, name: "John", editable: true },
{ Id: 2, name: "Bill", editable: false },
{ Id: 3, name: "Carl", editable: true },
{ Id: 4, name: "Elise", editable: false }
]
$("#GridEdit").ejGrid({
dataSource: data,
. . .
actionBegin: function (args) {
if (args.requestType == "beginedit") {
var obj = this.model.currentViewData[args.rowIndex];
if (!ej.getObject("editable", obj))
args.cancel = true;
}
},
columns: [
{ field: "Id", isPrimaryKey: true },
{ field: "name" },
{ field: "editable", editType: ej.Grid.EditingType.Boolean }
]
});
});
</script> |
<div class="cols-sample-area">
<div id="Grid" ej-grid e-datasource="data" e-allowsorting="true" e-allowpaging="true"
e-celledit="celledit"
. . .
<div e-columns>
<div e-column e-field="Id" e-headertext="ID"></div>
<div e-column e-field="name" e-headertext="Name" e-edittemplate="editTemp"></div>
<div e-column e-field="editable" e-headertext="Verified" e-edittype="boolean"></div>
</div>
</div>
</div>
<script>
var gridData = [
{ Id: 1, name: "John", editable: true },
{ Id: 2, name: "Bill", editable: false },
{ Id: 3, name: "Carl", editable: true },
{ Id: 4, name: "Elise", editable: false }
]
angular.module('listCtrl', ['ejangular'])
.controller('PhoneListCtrl', function ($scope) {
$scope.data = gridData;
$scope.celledit = function (args) {
if (!args.rowData.editable)
args.cancel = true
}
. . . .
. . .
$scope.editTemp = {
create: function () {
return "<input>";
},
read: function (args) {
args.ejAutocomplete('suggestionList').css('display', 'none');
return args.ejAutocomplete("getValue");
},
write: function (args) {
var data = ej.DataManager(gridData).executeLocal(new ej.Query().select("name"));
args.element.ejAutocomplete({ width: "100%", dataSource: data, showPopupButton: true, enableDistinct: true, value: args.rowdata !== undefined ? args.rowdata["name"] : "" });
}
};
});
</script> |