サーバーから応答が返ってきて、すべて問題ないように見えますが、何らかの理由でオートコンプリート ウィジェットのアイテムが表示されません。誰かが私が間違っていることを指摘できれば、それは大歓迎です。
オートコンプリート ボックスに何かを入力したときのサーバーからの応答:
{"d":[{"__type":"BlaBla.Services.svcMedication+Medication","MedicationId":0,"Name":"Name0"},{"__type":"BlaBla.Services.svcMedication+Medication","MedicationId":1,"Name":"Name1"},{"__type":"BlaBla.Services.svcMedication+Medication","MedicationId":2,"Name":"Name2"},{"__type":"BlaBla.Services.svcMedication+Medication","MedicationId":3,"Name":"Name3"},{"__type":"BlaBla.Services.svcMedication+Medication","MedicationId":4,"Name":"Name4"},{"__type":"BlaBla.Services.svcMedication+Medication","MedicationId":5,"Name":"Name5"},{"__type":"BlaBla.Services.svcMedication+Medication","MedicationId":6,"Name":"Name6"},{"__type":"BlaBla.Services.svcMedication+Medication","MedicationId":7,"Name":"Name7"},{"__type":"BlaBla.Services.svcMedication+Medication","MedicationId":8,"Name":"Name8"},{"__type":"BlaBla.Services.svcMedication+Medication","MedicationId":9,"Name":"Name9"},{"__type":"BlaBla.Services.svcMedication+Medication","MedicationId":10,"Name":"Name10"},{"__type":"BlaBla.Services.svcMedication+Medication","MedicationId":11,"Name":"Name11"},{"__type":"BlaBla.Services.svcMedication+Medication","MedicationId":12,"Name":"Name12"},{"__type":"BlaBla.Services.svcMedication+Medication","MedicationId":13,"Name":"Name13"},{"__type":"BlaBla.Services.svcMedication+Medication","MedicationId":14,"Name":"Name14"},{"__type":"BlaBla.Services.svcMedication+Medication","MedicationId":15,"Name":"Name15"},{"__type":"BlaBla.Services.svcMedication+Medication","MedicationId":16,"Name":"Name16"},{"__type":"BlaBla.Services.svcMedication+Medication","MedicationId":17,"Name":"Name17"},{"__type":"BlaBla.Services.svcMedication+Medication","MedicationId":18,"Name":"Name18"},{"__type":"BlaBla.Services.svcMedication+Medication","MedicationId":19,"Name":"Name19"}]}
オートコンプリートの定義とバインディング
<input id="acMedications" data-role="autocomplete" data-text-field="Name" data-bind="source: dsMedication, value: SelectedMedication"
style="width: 400px;" placeholder="Enter value..." />
ViewModel と DataSource の定義
$(document).ready(function() {
var viewModel = kendo.observable({
dsMedication: new kendo.data.DataSource({
transport: {
read: {
contentType: "application/json; charset=utf-8",
type: "POST",
url: "../Services/svcMedication.asmx/SearchMedication",
dataType: "json",
cache: false
},
update: {
contentType: "application/json; charset=utf-8",
type: "POST",
url: "../Services/svcMedication.asmx/SaveMedication",
dataType: "json",
cache: false
},
destroy: {
url: "../Services/svcMedication.asmx/DeleteMedication",
type: "DELETE",
dataType: "json",
cache: false
},
create: {
url: "../Services/svcMedication.asmx/SaveMedication",
type: "PUT",
cache: false
},
parameterMap: function(options, operation) {
if (operation !== "read" && options.models) {
return {
models: kendo.stringify(options.models)
};
}
options.MedicationParam = $('#acMedications').val();
return kendo.stringify(options);
}
},
batch: true,
schema: {
data: "d",
model: {
id: "MedicationId",
fields: {
MedicationId: {
type: "number"
},
Name: {
type: "text"
}
}
}
},
success: function(data) {
alert(data);
}
}),
SelectedMedication: null,
HasChanges: false,
save: function() {
this.dsMedication.sync();
this.set("HasChanges", false);
},
remove: function() {
if (confirm("Are you sure you want to delete this record?")) {
this.dsMedication.remove(this.SelectedMedication);
this.set("SelectedMedication", this.dsMedication.view()[0]);
this.change();
}
},
showForm: function() {
return this.get("SelectedMedication") !== null;
},
change: function() {
this.set("HasChanges", true);
}
});
kendo.bind($("#fmMedication"), viewModel);
});
前もって感謝します!