or
<
input
data-role
=
"SimpleWidget"
data-someoption="myoption" />
(
function
($) {
var
kendo = window.kendo,
ui = kendo.ui,
Widget = ui.Widget;
var
SimpleWidget= Widget.extend({
// custom widget stuff
});
})(jQuery);
// Kendo calls this method when a new widget is created
init:
function
(element, options) {
var
that =
this
;
Widget.fn.init.call(
this
, element, options);
}
//List of all options supported and default values
options: {
name:
"SimpleWidget"
,
value:
null
,
width:
"150"
,
someoption:
""
}
init:
function
(element, options) {
...
//Options are accessible via the options
$(that.element).val(options.someoption);
//Our internal widget's options property has also been updated for us
$(that.element).val(that.options.someoption);
...
}
(
function
($) {
var
kendo = window.kendo,
ui = kendo.ui,
Widget = ui.Widget;
var
SimpleWidget = Widget.extend({
// Kendo calls this method when a new widget is created
init:
function
(element, options) {
var
that =
this
;
Widget.fn.init.call(
this
, element, options);
//Our internal widget's options property has been updated for us
$(that.element).val(that.options.someoption);
},
//List of all options supported and default values
options: {
name:
"SimpleWidget"
,
value:
null
,
width:
"150"
,
someoption:
""
,
},
});
ui.plugin(SimpleWidget);
})(jQuery);
var
app = (
function
(win) {
'use strict'
;
var
onDeviceReady =
function
() {
//Do some stuff
};
// Handle "deviceready" event
document.addEventListener(
'deviceready'
, onDeviceReady,
false
);
// Initialize KendoUI mobile application
var
mobileApp =
new
kendo.mobile.Application(document.body, {
transition:
'slide'
,
skin:
'flat'
,
initial:
'bootstrap'
});
return
{
mobileApp: mobileApp
};
}(window));
var
app = app || {};
app.Bootstrap = (
function
() {
'use strict'
var
bootstrapViewModel = (
function
() {
var
show =
function
(e) {
// Check if user is online and do some stuff
// By accessing navigator.connection
};
return
{
show: show
};
}());
return
bootstrapViewModel;
}());
<
body
>
<!--Home-->
<
div
id
=
"bootstrap"
data-role
=
"view"
data-show
=
"app.Bootstrap.show"
>
<
div
class
=
"view-content"
>
<
h1
>My app</
h1
>
<
div
class
=
"content"
></
div
>
</
div
>
</
div
>
....
</
body
>
columns.Bound(c => c.RiskProfileLevel).ClientTemplate(RiskProfileLevelTemplate(/*RiskProfileLevel*/).ToHtmlString());
@helper RiskProfileLevelTemplate(int riskProfileLevel)
{
if (riskProfileLevel == 1)
{
<
div
style
=
"background-color: @CorporateSys.Website.Models.SiteUtil.RED_STYLE; width: 100%; height: 33px; margin: 0; padding: 0;"
></
div
>
}
else if (riskProfileLevel == 2)
{
<
div
style
=
"background-color: @CorporateSys.Website.Models.SiteUtil.AMBER_STYLE; width: 100%; height: 33px; margin: 0; padding: 0; "
></
div
>
}
else if (riskProfileLevel == 3)
{
<
div
style
=
"background-color: @CorporateSys.Website.Models.SiteUtil.GREEN_STYLE; width: 100%; height: 33px; margin: 0; padding: 0; "
></
div
>
}