or
<
div
id
=
"schedulerEventEditor"
>
<
fieldset
>
<
div
class
=
"editor-label"
>
@Html.LabelFor(model => model.Title)
</
div
>
<
div
class
=
"editor-field"
>
@Html.TextBoxFor(model =>model.Title, new {data_bind ="value: title"})
</
div
>
<
div
class
=
"editor-label"
>
@Html.LabelFor(model => model.Description)
</
div
>
<
div
class
=
"editor-field"
>
@Html.TextAreaFor(model => model.Description, new {rows = 5, cols=24, data_bind ="value: description"})
</
div
>
<
div
class
=
"editor-label"
>
@Html.LabelFor(model => model.Start)
</
div
>
<
div
class
=
"editor-field"
>
<
input
name
=
"start"
type
=
"text"
required
data-type
=
"date"
data-role
=
"datetimepicker"
data-bind
=
"value: start,invisible: isAllDay"
/>
<
input
name
=
"start"
type
=
"text"
required
data-type
=
"date"
data-role
=
"datepicker"
data-bind
=
"value: start,visible: isAllDay"
/>
</
div
>
<
div
class
=
"editor-label"
>
@Html.LabelFor(model => model.End)
</
div
>
<
div
class
=
"editor-field"
>
<
input
name
=
"end"
type
=
"text"
required
data-type
=
"date"
data-role
=
"datetimepicker"
data-bind
=
"value: end ,invisible:isAllDay"
/>
<
input
name
=
"end"
type
=
"text"
required
data-type
=
"date"
data-role
=
"datepicker"
data-bind
=
"value: end ,visible:isAllDay"
/>
</
div
>
<
div
class
=
"editor-label"
>
@Html.LabelFor(model => model.IsAllDay)
</
div
>
<
div
class
=
"editor-field"
>
<
input
type
=
"checkbox"
name
=
"isAllDay"
data-type
=
"boolean"
data-bind
=
"checked:isAllDay"
/>
</
div
>
<
div
class
=
"editor-label"
>
@Html.LabelFor(model => model.RecurrenceRule)
</
div
>
<
div
class
=
"reoccurenceContainer"
>
<
div
class
=
"editor-field"
>
<
div
data-bind
=
"value: recurrenceRule"
id
=
"recurrenceEditor"
></
div
>
</
div
>
</
div
>
</
fieldset
>
<
script
>
jQuery(function () {
$("\#recurrenceEditor").kendoRecurrenceEditor();
});
</
script
>
01.
sourceData
02.
function
CustomControlEditor(sourceData, defaultValue, templateType, controlType)
03.
{
04.
05.
if
(sourceData !=
null
&& sourceData !=
''
)
06.
{
07.
var
dd;
08.
if
(controlType ==
"Multiselect"
)
09.
{
10.
dd =
"<select id= 'dd' multiple='multiple' onchange='SensorDropDownChanged(this,\""
+ templateType +
"\");'>"
;
11.
12.
//get source data
13.
14.
//get default values
15.
16.
//populate list
17.
18.
return
dd;
19.
}
20.
else
if
(controlType ==
"Dropdownlist"
)
21.
{
22.
dd =
"<select id= 'dd' onchange='SensorDropDownChanged(this,\""
+ templateType +
"\");'>"
;
23.
24.
//get source data
25.
26.
//get default values
27.
28.
//populate list
29.
30.
return
dd;
31.
}
32.
33.
//textbox sourceData is list of validation attributes
34.
else
{
35.
36.
var
tb;
37.
38.
if
(defaultValue !=
null
)
39.
{
40.
41.
tb =
"<input id= 'tbText' type='text' value='"
+ defaultValue +
"' onblur='SensorTextBoxChanged(this,\""
+ templateType +
"\");' "
+ sourceData +
"/>"
;
42.
}
43.
else
44.
{
45.
tb =
"<input id='tbText' 'tb' type='text' 'onblur='SensorTextBoxChanged(this,\""
+ templateType +
"\");' "
+ sourceData +
"/>"
;
46.
}
47.
return
tb;
48.
}
49.
}
50.
51.
52.
}
var Model = kendo.data.Model.define({
id: "Id",
fields: {
Id: {
type: "string",
},
Name: {
type: "string",
},
Tags: []
},
mapping: {
Tags: {
children: function (data) {
return $.extend(data, {
onRemove: function (e) {
console.log(e);
}
});
}
}
}
});
kendo.mapping = function (source, mapping) {
var name,
value;
// if the user provides us a mapping, we can use that to help
// build the objects appropriately
for (name in source) {
if (source.hasOwnProperty(name)) {
// get the value for this property or item
value = source[name];
// try to determine if this is an array, or just a
// normal object. That will greatly dictate our choice of behavior
if (value instanceof Array) {
// if this is an array, then we will try to check for a
// key in the mapping schema
if (mapping[name].children) {
// if we discover a mapping key for this array, we
// will use it to reconstruct the array data
for (var i = 0; i < value.length; i++) {
source[name][i] = mapping[name].children(value[i]);
}
}
} else {
// attempt to match any non array type keys
if (mapping[name]) {
source[name] = mapping[name](value);
}
}
}
}
return source;
}
kendo.data.ObservableObject.prototype.fromJSON = function (source, mapping) {
var name,
value,
observable = this;
// if there is mapping given, then pass it through that first
if (mapping) {
source = kendo.mapping(source, mapping);
}
for (name in source) {
if (observable.hasOwnProperty(name)) {
observable.set(name, source[name]);
}
}
}
var viewModel = new Model({
Id: null,
Name: null,
Tags: []
});
var dataSource = new kendo.data.dataSource({
transport: {
read: {
url: '/data/items/',
dataType: "json",
type: 'GET'
}
},
schema: {
total: "total",
data: "data"
}
});
Id: "items/1",
Name: "Some Game Item",
Tags: [
{
Id: "tags/1",
Name: "Sword"
},
{
Id: "tags/2",
Name: "Weapon"
}
]
viewModel.fromJSON(data.toJSON(), viewModel.mapping);
filter: "tbody > tr"
var dataSource = new kendo.data.DataSource({
type: "json",
transport: {
read: function(options) {
db.transaction(queryRows, app.dbError);
function queryRows(tx) {
tx.executeSql("SELECT comps.*, (SELECT COUNT(*) FROM comps WHERE comps.comp_name LIKE ?) as total FROM comps WHERE comps.comp_name LIKE ? LIMIT ?, ?", ["%" + $("#search-comp-name").val() + "%", "%" + $("#search-comp-name").val() + "%", (options.data.page - 1) * 20, 20], queryRowsSuccess, queryRowsFailure);
}
function queryRowsSuccess(tx, results) {
var res = Array();
var total = 0;
for(var i = 0; i <
results.rows.length
; i++) {
res.push(results.rows.item(i));
}
if(results.rows.length > 0)
total = results.rows.item(0).total;
var resSchema = {
results: res, total: total
};
options.success(resSchema);
}
function queryRowsFailure(err) {
app.compListDbError();
}
}
},
schema: {
total: function (response) {
return response.total;
},
data: function(response) {
return response.results;
},
},
serverPaging: true,
pageSize: 20
});
$("#companyResultList").kendoMobileListView({
dataSource: dataSource,
template: $("#endless-scrolling-template").text(),
endlessScroll: true
});