DataSource binding of ListView

[Phil H.]

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