Hello Guys,
I have minified my example. I have some views with its viewmodel and globals.
Here is a part of my view:
<
div
>
<
div
id
=
"UrlIndex"
align
=
"center"
class
=
"v-center"
>
<
label
for
=
"icon-right"
>
<
h4
>Enter the URL</
h4
>
</
label
>
<
span
class
=
"k-textbox k-space-right"
style
=
"width:70%"
>
<
input
class
=
"k-textbox"
type
=
"text"
id
=
"icon-right"
data-bind
=
"value: url"
/>
<
a
href
=
"#"
class
=
"k-icon k-i-search"
></
a
>
</
span
>
</
div
>
</
div
>
Here is the viewModel for this View:
(
function
() {
var
app;
window.Books = kendo.observable({
url:
"Enter the url"
,
data:
new
kendo.data.DataSource({
transport: {
read:
this
.get(
"url"
)
},
schema: {
data:
"books"
}
}),
test:
function
(){
}
});
kendo.bind($(
"#UrlIndex"
), window.Books);
document.addEventListener(
"deviceready"
,
function
() {
navigator.splashscreen.hide();
app =
new
kendo.mobile.Application(document.body,{layout:
"main-layout"
});
},
false
);
window.app = app;
}());
This is the way i did the namespace and the viewmodel. Is there a better way to do this ? And another problem is that the binding to the view of
kendo.bind($(
"#UrlIndex"
), window.Books);
only works if it is inside the device-ready function. Can you tell me what is the right, efficient and common way to do this. Can u give an example how to works with namespaces and observables. If I wrap the document ready function at the beginning it still is not binding.
Another problem is this:
read:
this
.get(
"url"
)
It doesnt get the url, how is the right way. Thank you.