Hi,
I want to use CRUD features, but only predefined set of values are allowed for one field.
<div id="grid"></div>
<script>
$(document).ready(function () {
var crudServiceBaseUrl = "<?= base_url().'/index.php/'.$action?>";
var dataSource = new kendo.data.DataSource({
transport: {
read: {
url: crudServiceBaseUrl + "<?= '/read/'.$table_name?>",
dataType: "json"
},
update: {
url: crudServiceBaseUrl + "<?= '/update/'.$table_name?>",
type: "POST" ,
dataType: "json"
},
destroy: {
url: crudServiceBaseUrl + "<?= '/destroy/'.$table_name?>",
type: "POST" ,
dataType: "json"
},
create: {
url: crudServiceBaseUrl + "<?= '/create/'.$table_name?>",
type: "POST" ,
dataType: "json"
},
parameterMap: function(options, operation) {
if (operation !== "read" && options.models) {
return {models: kendo.stringify(options.models)};
}
}
},
pageSize: 30,
schema: {
model: {
id: "item_name",
fields: {
item_name: { validation: { required: true } },
item_type: { validation: { required: true, min: 1} },
item_calories: { type: "number", validation: { required: true, min: 1} },
item_ingredients: { },
item_category: {validation: { required: true } } ,
dish_type: {validation: { required: true } }
}
}
}
});
here dish_type can only contain VEG or NON VEG:
var categoryDataSource = new kendo.data.DataSource({
data: [ {
item_type: "Veg"
},
{
item_type: "Non Veg"
}
]
});
function categoryDropDownEditor(container, options) {
$('<input data-text-field="item_type" data-value-field="item_type" data-bind="value:' + options.field + '"/>') .appendTo(container)
.kendoDropDownList({
autoBind: false,
dataSource: categoryDataSource
});
}
$("#grid").kendoGrid({
dataSource: dataSource,
pageable: true,
height: 400,
toolbar: ["create"],
columns: [
{ field:"item_name", title: "Product Name" },
{ field: "dish_type", editor:categoryDropDownEditor },
{ field: "item_type", title:"Type", format: "{0:c}", width: "150px" },
{ field: "item_calories", title:"Calories", width: "150px" },
{ field: "item_ingredients", width: "300px" },
{ field: "item_category", width: "150px" },
{ command: ["edit", "destroy"], title: " ", width: "210px" }],
editable: "popup"
});
BUG: while editing, value selected in drop down is not reflected, whereas object is getting bound.. Kindly help.
Is it not recommended to use GRID for CRUD with predefined value for a field ?