Results 1 to 2 of 2

Thread: Help on Using JSON from Grails to Write a Grid

  1. #1
    Ext JS Premium Member
    Join Date
    Jul 2010
    Posts
    19

    Default Help on Using JSON from Grails to Write a Grid

    Hi
    Below are my code snippets,

    Grails Controller

    def list = {
    def txs = [rows:[]]
    def family = Family.findAll("from Family as fam where fam.closeDate > '1-jan-2010'").each {
    txs["rows"] << [id: it.id, familyName: it.familyName, restrictFlag:it.restrictFlag, closeDate: it.closeDate,commitments:it.commitments]
    }
    render txs as JSON
    }
    ---------------------------------------------------------
    list.gsp
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="layout" content="main" />
    <get var="entityName" value="${message(code: 'family.label', default: 'Family')}" />
    <title><g:message code="default.list.label" args="[entityName]" /></title>
    <link rel="stylesheet" href="${createLinkTo(dir:'js',file:'ext/resources/css/ext-all.css')}"></link>
    <link rel="stylesheet" href="${createLinkTo(dir:'js',file:'ext/resources/css/theme-aero.css')}"></link>
    <script type="text/javascript" src="${createLinkTo(dir:'js',file:'ext/adapter/ext/ext-base.js')}"></script>
    <script type="text/javascript" src="${createLinkTo(dir:'js',file:'ext/ext-all-debug.js')}"></script>
    <script type="text/javascript" charset="utf-8">
    Ext.BLANK_IMAGE_URL ="${createLinkTo(dir:'js',file:'ext/resources/images/default/s.gif')}";
    </script>
    <script type="text/javascript" src="${createLinkTo(dir:'js',file:'mygrid.js')}"></script>
    </head>
    <body>
    <div class="body">
    <div id="center-div"></div>
    </div>
    </body>
    </html>
    --------------------------------------------------------
    mygrid.js
    Ext.onReady(function(){

    var proxy=new Ext.data.HttpProxy({url:'/myapp/family/list'});

    var reader=new Ext.data.JsonReader(
    {
    },[
    {name: 'id', mapping: 'id'},
    {name: 'brokerRestrictFlag'},
    {name: 'closeDate'},
    {name: 'familyName'}
    ]
    )
    var store=new Ext.data.Store( {
    proxy:proxy,
    reader:reader
    });

    store.load();
    alert(store.data.length)

    // create the grid
    var grid = new Ext.grid.GridPanel({
    store: store,
    columns: [
    {header: "Family Id", width: 120, dataIndex: 'id'},
    {header: "Restrict Flag", width: 180, dataIndex: 'restrictFlag'},
    {header: "Close Date", width: 115, dataIndex: 'closeDate'},
    {header: "Family Name", width: 100, dataIndex: 'familyName'}
    ],
    renderTo:'center-div',
    width:540,
    height:200
    });
    });

    ------------------------
    but when try to access http://localhost:8080/myapp/family/list
    {"rows":[{""id":"6103F","familyName":"The Osborn","restrictFlag":"N","closeDate":"2010-03-01T05:00:00Z","commitments":[]}]}


    i am getting the json string printed in browser, the data is not getting into Grid,
    If i comment the render as JSON line in my controller then the onready functions is getting called, but no data
    Am i doing any silly mistake here

  2. #2
    Sencha User jay@moduscreate.com's Avatar
    Join Date
    Mar 2007
    Location
    DC Area =)
    Posts
    16,364

    Default

    the first mistake is not posting your code within code tags.

    I don't see you configure a root to your jsonReader (rows).

Similar Threads

  1. Extjs and Grails
    By douggiefox in forum Ext 3.x: Help & Discussion
    Replies: 0
    Last Post: 14 Oct 2009, 7:44 AM
  2. Passing JSON string from Grails to populate TreePanel
    By yenn in forum Ext 2.x: Help & Discussion
    Replies: 2
    Last Post: 10 Dec 2008, 5:49 PM
  3. Grails + ExtJS + JSON
    By cwi in forum Ext 2.x: Help & Discussion
    Replies: 3
    Last Post: 15 Sep 2008, 2:53 AM
  4. how to write custom json reader
    By ghoti143 in forum Ext 2.x: Help & Discussion
    Replies: 4
    Last Post: 3 Jun 2008, 12:53 PM

Tags for this Thread

Posting Permissions

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