ListView not populated

6 posts, 0 answers
  1. Martin Kelly
    Martin Kelly avatar
    17 posts
    Member since:
    Jan 2010

    Posted 14 Jul 2012 Link to this post

    I have the following code which is far as I can tell as per the documentation and examples but the listview always appears empty.
    My View is as follows
    @model iProjX.Models.RolesModel
    @using iProjX.Models;
    <script type="text/x-kendo-tmpl" id="rolesList">
        <h3> ${Id} ${Description}</h3>
    <div id="listView"></div>
    <div class="k-pager-wrap">
        <div id="pager"></div>
    <script type="text/javascript">
        var projectId = @(Html.Raw(Model.ProjectId));
        var sharedDataSource = new{
            transport: {
                    read: {
                        url: "http://localhost:1278/Project/getRoles",
                        type: "POST"
            change: function (data) {
                alert("success ");
            error: function (xhr, error) {
                alert("error ");
            pageSize: 3
        //Configure the List
            pageable: true,
            selectable: true,
            navigatable: true,
            template: kendo.template($("#rolesList").html()),
            dataSource: sharedDataSource
        //Configure the Pager
            dataSource: sharedDataSource


    And my controller contains

    public JsonResult getRoles([DataSourceRequest] DataSourceRequest request)
        var projectId = 113;
        using (LocationRepositry _locationRepository = new LocationRepositry())
            IEnumerable<myLocation> Locations = _locationRepository.getByProjectId_Simple(projectId).Select(p =>     new     myLocation()
                Id = p.Id,
                Description = p.Description
            return Json(Locations.ToDataSourceResult(request));

    And myLocation is

    public class myLocation
        public myLocation() {}
        public Int64 Id { get; set; }
        public String Description { get; set; }

    Now, with this implementation my controller function getRoles is hit and I can see the data returned from the server via browser tools as below.

    Data returned from server
    {"Data":[{"Id":132,"Description":"Location 1"},{"Id":133,"Description":"Location 2"},{"Id":134,"Description":"Location 3"},{"Id":135,"Description":"Location 4"}],"Total":4,"AggregateResults":null,"Errors":null}

    The change function on the datasource is then subsequently hit but the data parameter returned contains an empty set of Data items as below (taken from visual studio immediate window).

        items: []
        sender: {...}
        preventDefault: function(){g=!0}
        isDefaultPrevented: function(){return g}

    If I change my controller to return without using the ToDataSourceResult extension it actually will work.
        return Json(Locations);

    However, is this then the correct implementation or have I done something else wrong? And would this have an effect on how paging works?

    Any help would be much appreciated.




  2. Nikolay Rusev
    Nikolay Rusev avatar
    2275 posts

    Posted 16 Jul 2012 Link to this post

    Hello Martin,

    Adding the following to the DataSource config will eventually make it work:
    schema: {
     data: "Data" //<-- this is the field from the response which contains the actual data
     total: "Total" //<-- this is the total count of items in the response

    However why don't you use the Kendo ListView wrapper for MVC? You are already using the server part of Kendo UI MVC infrastructure anyways.

    Nikolay Rusev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Martin Kelly
    Martin Kelly avatar
    17 posts
    Member since:
    Jan 2010

    Posted 19 Jul 2012 Link to this post

    Hi Nikolay,
    Thanks for the info, this got it working for me.
    The reason I am not using the mvc wrappers is that I can find hardly any documentation on how to use them. I tried to use these first but was unable to get very far. At least when I have a problem when using straight javascript, I am able to look for similar examples and explanations which are always in javascript and never use the wrappers.
    For example using the wrapper, how can I represent your answer above, or define a datasource model with a number of fields or access the parameterMap in order to disable the load icon. There is no documentation that I can find showing any of this.
    As I have only started using the Kendo-UI (trialing with a view to purchase), the lack of any real documentation is a big problem for me and am finding the experience very frustrating.

    Great product, shame about the documentation

  4. Marcelo
    Marcelo avatar
    28 posts
    Member since:
    Jul 2010

    Posted 20 Jul 2012 Link to this post


    I'm having some troubles using Kendo ListView wrapper. I followed the documentation about ListView Binding (, but my ListView comes empty.

        .DataSource(dataSource => dataSource
            .Model(model => 
            .Read(read => read

    public ActionResult LoadMenuLista([DataSourceRequest]DataSourceRequest request)
        var lista = carregaMenu();
        DataSourceResult result = lista.ToDataSourceResult(request);
        return Json(result);
    <script type="text/x-kendo-tmpl" id="menuListTemplate">
    Any idea to solve this problem? Thanks.
  5. Martin Kelly
    Martin Kelly avatar
    17 posts
    Member since:
    Jan 2010

    Posted 21 Jul 2012 Link to this post

    Hi Marcelo,

    Try changing you model field definition to the following as this is how I defined it and it worked
    model.Field(f => f.Descricao)

    Does your controller function get hit? Check you browser tools, network tool (I find chrome very good) to see if there were any errors on the call to the controller. Also check the console.

    Also make sure the script "kendo.aspnetmvc.min.js" is correctly referenced and loaded.

    Hope this helps,
  6. sapan
    sapan avatar
    3 posts
    Member since:
    Oct 2012

    Posted 16 Nov 2012 Link to this post


    I have written following code inside the View.

    Razor View:
    <div id="wrapper">
                <div class="SettingArea">
                    @foreach (ModuleLinkViewModel moduleQuickLink in ViewBag.ModuleLinks as List<ModuleLinkViewModel>)
                        <script type="text/x-kendo-tmpl" id="template">
                                 <div id="mainareaforsettingicons">
                                    <div id="trans_bg">
                                        <div id="white_bg">
                                            <div id="settingicon">
                                                <dd><a href="@(Url.Content("~/" + (moduleQuickLink.Link)))" target="_self">
                                        <img src="@(Url.Content("~/Content/themes/default/images/Settings/") + (moduleQuickLink.Icon))"  alt="@(moduleQuickLink.ToolTip)" border="0"/></a></dd>
                                    <div id="reflaction">
                    <div id="Configuration"></div>
                        .DataSource(dataSource => dataSource
                            .Read(read => read.Action("Read", "Configuration"))
                <div id="footer_line_grey">
                <div id="footer_line_white">

    Controller :
     public ActionResult Index()
                IEnumerable<ModuleLinkViewModel> moduleLinks = this.GetAllConfigSettings(string.Empty);
                ViewBag.ModuleLinks = moduleLinks;

                return this.View();

            [OutputCache(Duration = 0, VaryByParam = "None")]
            public ActionResult Read([DataSourceRequest]DataSourceRequest request, string searchSettingKeyword)
                IEnumerable<ModuleLinkViewModel> moduleLinks = this.GetAllConfigSettings(searchSettingKeyword);
                ViewBag.ModuleLinks = moduleLinks;

                return this.Json(moduleLinks.ToList().ToDataSourceResult(request));

    Now the problem is that when I do run the solution I could not able to see the ListView appearing on the page. But as and when I am seeing it's View Source I do able to see that all the necessary rows are appearing inside.

    Can anyone please guide where am I doing mistake?

Back to Top