Results 1 to 5 of 5

Thread: Display 'no records' in the grid's body

  1. #1

    Default Display 'no records' in the grid's body

    I've searched the forum but nothing turned up. Maybe I typed in the wrong terms.

    I think this is already supported but I can't find the relevant info in the api doc.

    (BTW, the doc http://extjs.com/deploy/ext/docs/out...grid.Grid.html is messed up, scroll to the bottom and you see the if the a an config options...)

    I've seen this implemented in BernardChhun's nice real estate site http://go.waka.ca/

    Basically when there's no rows to display in the grid, the grid view body shows

    There's no results for your search criteria.
    Change your criteria <- a href link

    There should be a built-in mechanism to do that, right?

    Thanks.
    papasi

  2. #2
    Ext Premium Member BernardChhun's Avatar
    Join Date
    Mar 2007
    Location
    Quebec, Canada
    Posts
    831

    Default

    it was a hack man!

    seriously here it is :

    Code:
    loadFunction = function() {
     if(this.grid.dataSource.getCount() == 0){
      this.grid.view.mainBody.update("<div style='height:75px; font:11px arial, helvetica;padding:20px;'>"+ _("no-search") +"</div>");
     }else{
      this.grid.selModel.selectFirstRow();
     }
     this.clear();
     this.pageCursor = this.currentPage();
    }
    dataStore.on("load", loadFunction , this, true);
    it's basically a load handler that checks the number of data in the dataStore.

    if its equal to 0, we just write some html into the GridView's body.

  3. #3

    Default

    works great! many thx.

    (i guess putting your name in the thread title was very effective )
    papasi

  4. #4

    Default

    Quote Originally Posted by BernardChhun View Post
    it was a hack man!

    seriously here it is :

    Code:
    loadFunction = function() {
     if(this.grid.dataSource.getCount() == 0){
      this.grid.view.mainBody.update("<div style='height:75px; font:11px arial, helvetica;padding:20px;'>"+ _("no-search") +"</div>");
     }else{
      this.grid.selModel.selectFirstRow();
     }
     this.clear();
     this.pageCursor = this.currentPage();
    }
    dataStore.on("load", loadFunction , this, true);
    it's basically a load handler that checks the number of data in the dataStore.

    if its equal to 0, we just write some html into the GridView's body.
    Thanks! I also was looking for a solution to this problem.

  5. #5
    Ext User
    Join Date
    Jan 2008
    Location
    Antibes, France
    Posts
    12

    Default

    in your gridPanel, just use this config options :
    PHP Code:
    autoHeighttrue,
    viewConfig: {
        
    emptyText'<div align="center">Please drop me something to eat...</div>'

    the only "trick" is that you have to refresh the gridView after it has been shown :
    PHP Code:
    Ext.getCmp('myGridId').getView().refresh(); 
    It's kind of easier...
    Last edited by peter.riche; 11 Feb 2008 at 11:15 PM. Reason: forgotten 'autoHeight: true' and don't wanna read "it doesn't work"!
    PHP Code:
    Peter.speaks "French";
    if (
    Peter.speaks == "French"You.DontMind(Peter.English); 

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •