This is a migrated thread and some comments may be shown as answers.

DataSource binding of ListView

0 Answers 59 Views
ListView (Mobile)
This is a migrated thread and some comments may be shown as answers.
Phil H.
Top achievements
Rank 2
Phil H. asked on 10 Jan 2013, 01:02 AM
Hi:

I would like to share some code.  This is a MVC application accessing web-server that is returned as json:
@{
    ViewBag.Title = "Home Page";
}
<script id="contact-template" type="text/x-kendo-template">
    <div class="mm-contact">
        <span class="mm-title" data-bind="text: Title"></span><br />
        <span data-bind="text: FirstName"></span> <span data-bind="text: LastName"></span><br />
        Extension: <span data-bind="text: Extension1"></span><br />
        mail: <span data-bind="text: Email"></span>
    </div>
</script>
<div id="ProductSales" data-role="view" data-model="vm" data-layout="default" data-title="Product Sales">
    <header data-role="header">
        <div data-role="navbar">Product Sales</div>
    </header>
    <div id='lv' data-role="listview" data-bind="source: productSalesContacts" data-template="contact-template"></div>
</div>
<script type="text/javascript">
    var Staff = kendo.data.Model.define({
        id: "ID",
        fields: {
            // data type of the field {Number|String|Boolean|Date} default is String
            ID: { type: "Numeric", editable: false, nullable: true },
            LastName: { type: "String", validation: { required: true } },
            FirstName: { type: "String", validation: { required: true } },
            Title: { type: "String" },
            City: { type: "String" },
            State: { type: "String" },
            Email: { type: "String" },
            Phone1: { type: "String" },
            Extension1: { type: "String" },
            Sequence: { type: "Numeric", nullable: true }
        }
    });
    var vm = kendo.observable({
        productSalesContacts: new kendo.data.DataSource({
            transport: {
                read: {
                    url: "/Services/Contacts.asmx/ProductSales",
                    dataType: "json",
                    type: "POST",
                    contentType: "application/json; charset=utf-8"
                },
            },
            schema: {
                data: "d",
                model: Staff
            }
        })
    });
</script>
Good luck:
Phil

No answers yet. Maybe you can help?

Tags
ListView (Mobile)
Asked by
Phil H.
Top achievements
Rank 2
Share this question
or