or
new kendo.mobile.Application()
<!DOCTYPE html>
<
html
>
<
head
>
<
meta
charset
=
"utf-8"
/>
<
title
>@ViewBag.Title</
title
>
@*Kendo*@
<
link
href
=
"../../styles/kendo.common.min.css"
rel
=
"Stylesheet"
/>
<
link
href
=
"../../styles/kendo.mobile.all.min.css"
rel
=
"Stylesheet"
/>
<
script
src
=
"../../js/jquery.min.js"
type
=
"text/javascript"
></
script
>
<
script
src
=
"../../js/kendo.all.min.js"
type
=
"text/javascript"
></
script
>
@*Mine*@
<
script
src
=
"../../myJs/Init1.js"
type
=
"text/javascript"
></
script
>
<
script
src
=
"../../myJs/FundingSources1.js"
type
=
"text/javascript"
></
script
>
<
script
src
=
"../../myJs/CardFundings1.js"
type
=
"text/javascript"
></
script
>
</
head
>
<
body
>
<
div
id
=
"card-fundings"
data-role
=
"view"
data-title
=
"Available Funds"
>
<
div
class
=
"head"
> </
div
>
<
h2
id
=
"h2-card-id"
>Available Funds</
h2
>
<
ul
data-role
=
"listview"
data-style
=
"inset"
data-type
=
"group"
>
<
li
>
<
ul
id
=
"listview-card-fundings"
>
<
li
>Javascript must be</
li
>
<
li
>enabled</
li
>
</
ul
>
</
li
>
</
ul
>
<
div
data-role
=
"footer"
>
<
div
data-role
=
"tabstrip"
>
<
a
id
=
"getCount"
data-role
=
"button"
data-icon
=
"contacts"
>Get Count</
a
>
</
div
>
</
div
>
</
div
>
<
script
id
=
"template-funding-sources"
type
=
"text/x-kendo-template"
>
<
li
data-icon
=
"cart"
><
a
href
=
"\#tabstrip-new"
class
=
"km-listview-link data-role="
listview-link">#= FundingSourceName # #= AvailableBalance #</
a
></
li
>
</
script
>
<
script
type
=
"text/javascript"
>
$(document).ready(function () {
init();
});
</
script
>
</
body
>
</
html
>
init =
function
() {
var
kma =
new
kendo.mobile.Application(document.body);
//android test
//$("body").removeClass("km-ios").addClass("km-android");
$(
"#getCount"
).click(
function
() {
enterFundingSourceNames();
});
getFundingSources();
}
getFundingSources():getCardFundings():FundingSource_Model = kendo.data.Model.define({
fundingSourceID:
"FundingSourceID"
});
getFundingSources =
function
() {
dsFundingSources =
new
kendo.data.DataSource({
transport: {
read: {
url:
"Home/GetFundingSources"
,
dataType:
"json"
}
},
schema: {
model: FundingSource_Model
}
});
dsFundingSources.read();
}
And here's where I need help:CardFunding_Model = kendo.data.Model.define({
cardID:
"CardID"
});
getCardFundings =
function
() {
var
templateFundingSources = kendo.template($(
"#template-funding-sources"
).html());
dsCardFundings =
new
kendo.data.DataSource({
transport: {
read: {
url:
"/Home/GetCardFundings"
,
// the remove service url
dataType:
"json"
,
// JSONP (JSON with padding) is required for cross-domain AJAX
data: {
//additional parameters sent to the remote service
_cardId: fundingItem.cardID
}
}
},
schema: {
model: CardFunding_Model
},
change:
function
() {
// subscribe to the CHANGE event of the data source
$(
"#listview-card-fundings"
).html(kendo.render(templateFundingSources,
this
.view()));
}
});
dsCardFundings.read();
}
I know I could do a join operation on the server and retrieve the FundingSourceName that way, but I'm trying to minimize the load on the server, and since the FundingSources will be static all day, I'd rather the mobile app do that work. Also, as vendors add purchases against the various FundingSource AvailableBalances, I'm going to need to update the listview programmatically to reflect what's left in the till for each FundingSource, so no matter what, I'm going to need to update the UI for them. Is there a way to access the listview and update record items programmatically? Thanks, MikeenterFundingSourceNames =
function
() {
var
thisRecord =
null
;
var
thisFundingSourceID =
null
;
var
totCardFundings = dsCardFundings.total();
for
(
var
i = 0; i < totCardFundings; i++) {
thisRecord = dsCardFundings.at(i);
thisFundingSourceID = thisRecord.FundingSourceID;
//------------------------------------------------------------------------------------------------------
//Here's where I need to iterate through the listview and change the values for CardFundingName
//----------------------------------------------------------------------------------------------------
};
//this doesn't work
//$("#listview-card-fundings").data("kendoListView").refresh();
}
<
div
data-role
=
"view"
data-title
=
" Control Panel - Mobile"
id
=
"listmessages"
data-init
=
"listMessagesInit"
>
<
h2
>Customer Messages</
h2
>
<
p
><?
php
echo $unread_messages . ' - unread messages'; ?></
p
> <
a
data-align
=
"right"
data-role
=
"button"
id
=
"markasread"
>Mark as read</
a
><
a
data-align
=
"right"
data-role
=
"button"
id
=
"delete"
>Delete</
a
>
<
ul
id
=
"message_list"
>
<
li
class
=
"isnew_1"
id
=
"890"
><
a
href
=
"/messages/view/890"
>
<
div
style
=
"float:left; width:150px; height: 50px"
>customer name<
br
/>date</
div
>
<
div
style
=
"height: 50px"
id
=
"message_#= id #"
>customer name</
div
>
</
a
></
li
><
li
class
=
"isnew_0"
id
=
"234"
><
a
href
=
"/messages/view/#= id #"
>
<
div
style
=
"float:left; width:150px; height: 50px"
>customer name<
br
/>date</
div
>
<
div
style
=
"height: 50px"
id
=
"message_#= id #"
>customer name</
div
>
</
a
></
li
><
li
class
=
"isnew_0"
id
=
"456"
><
a
href
=
"/messages/view/#= id #"
>
<
div
style
=
"float:left; width:150px; height: 50px"
>customer name<
br
/>date</
div
>
<
div
style
=
"height: 50px"
id
=
"message_234"
>customer name</
div
>
</
a
></
li
>
</
ul
>
</
div
>
<
script
>
function listMessagesInit(){
$("#message_list").kendoMobileListView({
style: "inset",
});
}
</
script
>
<
div
data-role
=
"view"
data-title
=
"Control Panel - Mobile"
id
=
"listmessages"
data-init
=
"listMessagesInit"
>
<
h2
>Customer Messages</
h2
>
<
p
><?
php
echo $unread_messages . ' - unread messages'; ?></
p
> <
a
data-align
=
"right"
data-role
=
"button"
id
=
"markasread"
>Mark as read</
a
><
a
data-align
=
"right"
data-role
=
"button"
id
=
"delete"
>Delete</
a
>
<
ul
id
=
"message_list"
></
ul
>
</
div
>
<
script
id
=
"message_list_template"
type
=
"text/x-kendo-template"
>
<
li
class
=
"isnew_#= isnew #"
id
=
"#= id #"
><
a
href
=
"/messages/view/#= id #"
>
<
div
style
=
"float:left; width:150px; height: 50px"
>#= customer_name #<
br
/>#= created #</
div
>
<
div
style
=
"height: 50px"
id
=
"message_#= id #"
>#= message #</
div
>
</
a
></
li
>
</
script
>
function listMessagesInit(){
var messageDataSource = new kendo.data.DataSource({
transport: {
read: "/messages/data",
dataType: "json",
schema: {
model: {
id: "id",
fields: {
created: { type: "string" },
message: { type: "string" },
customer_name: { type: "string" },
isnew: { type: "string" }
}
}
},
});
$("#message_list").kendoMobileListView({
dataSource: messageDataSource,
//pullToRefresh: true,
//appendOnRefresh: true,
style: "inset",
template: $("#message_list_template").text()
});
}
public class PeopleService
{
List<
Person
> people = new List<
Person
>()
{
new Person(50, "Fred"),
new Person(30, "John"),
new Person(26, "Andrew"),
new Person(24, "Xaier"),
new Person(5, "Mark"),
new Person(6, "Cameron"),
};
public IQueryable<
Person
> People
{
get { return people.AsQueryable<
Person
>(); }
}
}
<script>
var
myDataSource = {
type:
"odata"
,
transport:
{
read:
"http://localhost:56626/WcfDataService1.svc/People"
}
};
$(document).ready(
function
() {
$(
"#grid"
).kendoGrid({
dataSource: myDataSource,
height: 500,
columns: [
"Age"
,
"Name"
]
});
});
</script>
<?
xml
version
=
"1.0"
encoding
=
"utf-8"
standalone
=
"yes"
?>
<
feed
xml:base
=
"http://localhost:56626/WcfDataService1.svc/"
xmlns:d
=
"http://schemas.microsoft.com/ado/2007/08/dataservices"
xmlns:m
=
"http://schemas.microsoft.com/ado/2007/08/dataservices/metadata"
xmlns
=
"http://www.w3.org/2005/Atom"
>
<
title
type
=
"text"
>People</
title
>
<
id
>http://localhost:56626/WcfDataService1.svc/People</
id
>
<
updated
>2012-04-27T15:18:58Z</
updated
>
<
link
rel
=
"self"
title
=
"People"
href
=
"People"
/>
<
entry
>
<
id
>http://localhost:56626/WcfDataService1.svc/People('Fred')</
id
>
<
title
type
=
"text"
></
title
>
<
updated
>2012-04-27T15:18:58Z</
updated
>
<
author
>
<
name
/>
</
author
>
<
link
rel
=
"edit"
title
=
"Person"
href
=
"People('Fred')"
/>
<
category
term
=
"WebApplication1.Person"
scheme
=
"http://schemas.microsoft.com/ado/2007/08/dataservices/scheme"
/>
<
content
type
=
"application/xml"
>
<
m:properties
>
<
d:Age
m:type
=
"Edm.Int32"
>50</
d:Age
>
<
d:Name
>Fred</
d:Name
>
</
m:properties
>
</
content
>
</
entry
>
<
entry
>
<
id
>http://localhost:56626/WcfDataService1.svc/People('John')</
id
>
<
title
type
=
"text"
></
title
>
<
updated
>2012-04-27T15:18:58Z</
updated
>
<
author
>
<
name
/>
</
author
>
<
link
rel
=
"edit"
title
=
"Person"
href
=
"People('John')"
/>
<
category
term
=
"WebApplication1.Person"
scheme
=
"http://schemas.microsoft.com/ado/2007/08/dataservices/scheme"
/>
<
content
type
=
"application/xml"
>
<
m:properties
>
<
d:Age
m:type
=
"Edm.Int32"
>30</
d:Age
>
<
d:Name
>John</
d:Name
>
</
m:properties
>
</
content
>
</
entry
>
<
entry
>
<
id
>http://localhost:56626/WcfDataService1.svc/People('Andrew')</
id
>
<
title
type
=
"text"
></
title
>
<
updated
>2012-04-27T15:18:58Z</
updated
>
<
author
>
<
name
/>
</
author
>
<
link
rel
=
"edit"
title
=
"Person"
href
=
"People('Andrew')"
/>
<
category
term
=
"WebApplication1.Person"
scheme
=
"http://schemas.microsoft.com/ado/2007/08/dataservices/scheme"
/>
<
content
type
=
"application/xml"
>
<
m:properties
>
<
d:Age
m:type
=
"Edm.Int32"
>26</
d:Age
>
<
d:Name
>Andrew</
d:Name
>
</
m:properties
>
</
content
>
</
entry
>
<
entry
>
<
id
>http://localhost:56626/WcfDataService1.svc/People('Xaier')</
id
>
<
title
type
=
"text"
></
title
>
<
updated
>2012-04-27T15:18:58Z</
updated
>
<
author
>
<
name
/>
</
author
>
<
link
rel
=
"edit"
title
=
"Person"
href
=
"People('Xaier')"
/>
<
category
term
=
"WebApplication1.Person"
scheme
=
"http://schemas.microsoft.com/ado/2007/08/dataservices/scheme"
/>
<
content
type
=
"application/xml"
>
<
m:properties
>
<
d:Age
m:type
=
"Edm.Int32"
>24</
d:Age
>
<
d:Name
>Xaier</
d:Name
>
</
m:properties
>
</
content
>
</
entry
>
<
entry
>
<
id
>http://localhost:56626/WcfDataService1.svc/People('Mark')</
id
>
<
title
type
=
"text"
></
title
>
<
updated
>2012-04-27T15:18:58Z</
updated
>
<
author
>
<
name
/>
</
author
>
<
link
rel
=
"edit"
title
=
"Person"
href
=
"People('Mark')"
/>
<
category
term
=
"WebApplication1.Person"
scheme
=
"http://schemas.microsoft.com/ado/2007/08/dataservices/scheme"
/>
<
content
type
=
"application/xml"
>
<
m:properties
>
<
d:Age
m:type
=
"Edm.Int32"
>5</
d:Age
>
<
d:Name
>Mark</
d:Name
>
</
m:properties
>
</
content
>
</
entry
>
<
entry
>
<
id
>http://localhost:56626/WcfDataService1.svc/People('Cameron')</
id
>
<
title
type
=
"text"
></
title
>
<
updated
>2012-04-27T15:18:58Z</
updated
>
<
author
>
<
name
/>
</
author
>
<
link
rel
=
"edit"
title
=
"Person"
href
=
"People('Cameron')"
/>
<
category
term
=
"WebApplication1.Person"
scheme
=
"http://schemas.microsoft.com/ado/2007/08/dataservices/scheme"
/>
<
content
type
=
"application/xml"
>
<
m:properties
>
<
d:Age
m:type
=
"Edm.Int32"
>6</
d:Age
>
<
d:Name
>Cameron</
d:Name
>
</
m:properties
>
</
content
>
</
entry
>
</
feed
>