We need uniform implementation and dedicated documentation similar to "Configuration" that describes how to declaratively bind controls. I'm having to do a lot of repetitive coding for binding that should be a simple declarative structure. You should be able to enable a property on your kendo framework and request it to declaratively data bind and off you go. Very little coding necessary. For example:
<input id="siteList" class="ctrlDropDown" data-template="#siteListTemplate" data-dataurl="Layout/sites.json" data-selector="sites" />
$(".ctrlDropDown")
.each(function (index, htmlControl) {
var control = $(htmlControl);
var dataSourceUrl = control.attr("data-dataurl");
//alert(dataSourceUrl);
var dataSourceCallback = control.attr("data-datacallback");
var template = control.attr("data-template");
var dataType = control.attr("data-type");
var dataText = control.attr("data-text");
var dataValue = control.attr("data-value");
var dataSelector = control.attr("data-selector");
//alert(dataSelector);
var dataSource = new kendo.data.DataSource({
type: (dataType != null) ? dataType : null,
transport: {
read: {
url: dataSourceUrl,
jsonpCallback: (dataSourceCallback != null) ? dataSourceCallback : ""
}
}
});
dataSource.fetch(function (data) {
//alert(JSON.stringify(data.sender._pristine));
control.kendoDropDownList({
autoBind: true,
dataTextField: dataText,
dataValueField: (dataValue != null) ? dataValue : dataText,
template: (template != null) ? kendo.template($(template).html()) : null,
dataSource: (dataSelector != null) ? eval("data.sender._pristine." + dataSelector) : data.sender._pristine
});
});
});
<input id="siteList" class="ctrlDropDown" data-template="#siteListTemplate" data-dataurl="Layout/sites.json" data-selector="sites" />
$(".ctrlDropDown")
.each(function (index, htmlControl) {
var control = $(htmlControl);
var dataSourceUrl = control.attr("data-dataurl");
//alert(dataSourceUrl);
var dataSourceCallback = control.attr("data-datacallback");
var template = control.attr("data-template");
var dataType = control.attr("data-type");
var dataText = control.attr("data-text");
var dataValue = control.attr("data-value");
var dataSelector = control.attr("data-selector");
//alert(dataSelector);
var dataSource = new kendo.data.DataSource({
type: (dataType != null) ? dataType : null,
transport: {
read: {
url: dataSourceUrl,
jsonpCallback: (dataSourceCallback != null) ? dataSourceCallback : ""
}
}
});
dataSource.fetch(function (data) {
//alert(JSON.stringify(data.sender._pristine));
control.kendoDropDownList({
autoBind: true,
dataTextField: dataText,
dataValueField: (dataValue != null) ? dataValue : dataText,
template: (template != null) ? kendo.template($(template).html()) : null,
dataSource: (dataSelector != null) ? eval("data.sender._pristine." + dataSelector) : data.sender._pristine
});
});
});