This is a migrated thread and some comments may be shown as answers.

Problème with editor in grid

3 Answers 78 Views

Grid

This is a migrated thread and some comments may be shown as answers.

Dany asked on 08 Feb 2017, 01:59 AM

In one grid i have a dropdownlist editor in one column. When grid load, i see the value but when i edit my row (inline), the value is not selected in dropdownlist. When i click on the arrow dropdownlist expand and close immediatly. What is my problem ?

@* Liste des téléphones *@
var phoneDs = new kendo.data.DataSource({
transport: {
read: {
url: "@Url.Action("ShowPhones", "SupplierInformations")",
method: "post",
dataType: "json"
},
update: {
url: "@Url.Action("UpdatePhone", "SupplierInformations")",
method: "post",
dataType: "json"
},
destroy: {
url: "@Url.Action("DeletePhone", "SupplierInformations")",
method: "post",
dataType: "json"
},
create: {
url: "@Url.Action("AddPhone", "SupplierInformations")",
method: "post",
dataType: "json"
},
parameterMap: function(options, operation) {
if (operation !== "read" && options.models) {
return {models: kendo.stringify(options.models)};
}
else
{
//return options;
}
}
},
batch: true,
autoSync: true,
schema: {
model: {
id: "PhoneId",
fields: {
PhoneId: { editable: false, nullable: true },
PhoneNumber: { validation: { required: true,
phonevalidation: function (input)
{
if (input.is("[name='PhoneNumber']")) {
input.attr("data-phonevalidation-msg", "@LocalizationValues.The_Phone_Number_Format_Is_Invalid");
return /^@RegexHelper.PhoneRegex^/.test(input.val());
}

return true;
}
} },
PhoneExtension: { validation: { required: false,
extensionvalidation: function (input)
{
if (input.is("[name='PhoneExtension']") && input.val() != "") {
input.attr("data-extensionvalidation-msg", "@LocalizationValues.The_Phone_extension_Is_Invalid");
return /^\d+$/.test(input.val());
}

return true;
}}},
PhoneTypes: { validation: { required: true} },
IsEmergency: { type: "boolean" },
Type: { validation: { required: true,
typevalidation: function (input)
{
if (input.is("[name='Type']")) {
input.attr("data-typevalidation-msg", "@LocalizationValues.The_Phone_Type_Is_Mandatory");
return (input.val() != "");
}

return true;
}
} }
}
}
}
});

$("#phoneGrid").kendoGrid({
dataSource: phoneDs,
pageable: false,
dataBound: function(e){ },
pageSize: 99999,
toolbar: [ {name: "create", text : "@LocalizationValues.Add"}],
columns: [
{ field: "Type", width: "130px", editor: typeDropDownEditor, title: "Type"},
{
field: "PhoneNumber", editor: phoneEditor, title: "PhoneNumber", format: "{0:n}", width: "250px" },
{ field: "PhoneExtension", title:"PhoneExtension", width: "150px", template: '@LocalizationValues.Ext: #: (PhoneExtension == null) ? "" : PhoneExtension#' },
{ command: [{ name : "edit", text: {
edit: "@LocalizationValues.Update",
update: "@LocalizationValues.Confirm",
cancel: "@LocalizationValues.Cancel"
}},
{ name : "destroy", text: "@LocalizationValues.Remove"}], title: " ", width: "250px"}],
editable: {mode : "inline", confirmation: false},
});

function typeDropDownEditor(container, options) {
$('<input name="' + options.field + '"/>')
.appendTo(container)
.kendoDropDownList({
autoBind: false,
dataTextField: "Text",
dataValueField: "Value",
dataSource: @(New HtmlString(Json.Encode(Model.PhoneTypes)))
});

Problème with editor in grid

3 Answers, 1 is accepted