Best way to handle no data in a DataSource

4 posts, 0 answers
  1. PromptAlert Inc.
    PromptAlert Inc. avatar
    5 posts
    Member since:
    Sep 2011

    Posted 04 Jul 2012 Link to this post

    We are using a DataSource for a search result. When there are rows returned, we display a template in a ListView. When there is no data returned from the search we'd like to indicate 'No records to display' similar to the RadGrid setting.

    What is the best way to do this? We can return 'No records to display' in the json response but it will not fit well into our template.

  2. Dimo
    Admin
    Dimo avatar
    7491 posts
    Member since:
    Sep 2012

    Posted 05 Jul 2012 Link to this post

    Hello,

    Even if there are no returned records, the dataBound event will be fired. You can use the corresponding handler to modify the ListView's markup and inject an appropriate message.

    if (this.dataSource.total() == 0) {
           // no records
    }


    Greetings,
    Dimo
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!

  3. PromptAlert Inc.
    PromptAlert Inc. avatar
    5 posts
    Member since:
    Sep 2011

    Posted 06 Jul 2012 Link to this post

    Thanks. The problem with this solution is that we are using a template to display the results.

    Something like:
    template: "Name: ${data.name}<br/>Result: ${data.result}

    So we'd get something like:

    Name: No records to display
    Result:

    We'd prefer:

    No records to display 


  4. Robert
    Robert avatar
    2 posts
    Member since:
    Jun 2012

    Posted 09 Jul 2012 Link to this post

    I had a similar problem, I have just used jquery to insert what I want in the event that no results have been returned.

    For example

    $("#auditResults").kendoListView({
    template: "<li id='structuredata-${id}' title='${notes}'>${title} - ${lastupdated}</li>",
                    dataSource: auditDataSource,
    selectable: true,
    dataBound: function () {
    if (this.dataSource.total() == 0) 
    {
    // no records
    $("#auditResults").html('<li>Nothing Found.</li>');
    }
    }
    });

    You can just change the selector to whatever you need and push in the html as you need to.

Back to Top