將ExtJS與Grails集成時沒有輸出

下面是我的music.TuneController中的列表動作。

def list = { 
    def tuneInstanceList = new ArrayList<Tune>() 
    def tune= new Tune(); 
    tune.playerId = "ASDF"; 
    tune.playerPrice= "100"; 
    tuneInstanceList.add(tune);      
    def listResult = [ total: tuneInstanceList.size(), items: tuneInstanceList] 
    render listResult as JSON   
}

我在調grid.js代碼

/* 
* Ext JS Library 2.0 Beta 1 
* Copyright(c) 2006-2007, Ext JS, LLC. 
* [email protected] 
* 
* http://extjs.com/license 
*/ 

Ext.onReady(function(){ 

    // create the Data Store 
    var ds = new Ext.data.Store({ 
     autoLoad: true, 
     proxy: new Ext.data.HttpProxy({ 
     url: 'http://localhost:8080/music'}), 
     reader: new Ext.data.JsonReader({ 
     results: 'total', 
     root:'items', 
     id:'id' 
     }, 
     [ 
       {name: 'playerId' }, 
       {name: 'playerPrice'}    
      ] 
     ) 
    }); 

    var cm = new Ext.grid.ColumnModel([ 
     {header: "Player Id", width: 120, dataIndex: playerId }, 
     {header: "Player Price", width: 180, dataIndex: 'playerPrice'} 
    ]); 
    cm.defaultSortable = true; 

    // create the grid 
    var grid = new Ext.grid.GridPanel({ 
     ds: ds, 
     cm: cm, 
     renderTo:'grid-example', 
     width:540, 
     height:200 
    }); 
});

的list.gsp：

<%@ page import="music.Tune"%> 
<html> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
     <meta name="layout" content="test" /> 
     <g:set var="entityName" value="${message(code: 'song.label', default: 'Song')}" /> 
     <title><g:message code="default.list.label" args="[entityName]" /></title> 
      <g:javascript library="tune-grid"/> 
    </head> 
    <body> 

     <div class="body"> 
     <!--<g:javascript library="examples"/>--> 
     <!-- EXAMPLES --> 

     <div id="grid-example"></div> 


     </div> 

    </body> 
</html>

當動作被調用時，我得到了下面的輸出。看起來控制器根本不會到達list.gsp。

{"total":1,"items":[{"class":"music.Tune","playerId":"ASDF", playerPrice":"100","playerDep":null}]}

你能告訴我我在做什麼錯嗎？

謝謝！

來源

2010-10-15 MAlex

好吧，我把你的代碼去，但有幾個問題：

你需要一個動作渲染GSP，另一個呈現JSON例如

def list = { 

    } 

    def listData = { 
    def tuneInstanceList = new ArrayList<Tune>() 
    def tune = new Tune(); 
    tune.playerId = "ASDF"; 
    tune.playerPrice = "100"; 
    tuneInstanceList.add(tune); 
    def listResult = [total: tuneInstanceList.size(), items: tuneInstanceList] 
    render listResult as JSON 
    }

，然後在網格設置：

var ds = new Ext.data.Store({ 
     autoLoad: true, 
     proxy: new Ext.data.HttpProxy({ 
      url: 'http://localhost:8080/music/tune/listData'}), 
<snip>

也有在你的JS導入一個錯字（你的文件被稱爲調grid.js但你的GSP正在尋找測試網。。JS

我也不得不解決您的列設置（你需要把playerId引號）：

var cm = new Ext.grid.ColumnModel([ 
     {header: "Player Id", width: 120, dataIndex: 'playerId' }, 
     {header: "Player Price", width: 180, dataIndex: 'playerPrice'} 
    ]);

最後，我有得到在正確的地方ExtJS的文件和資源，其中包括：

<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>  
    <g:javascript src="adapter/ext/ext-base.js"/> 
    <g:javascript src="ext-all.js"/> 
    <g:javascript src="test-grid.js"/> 
    <link rel="stylesheet" type="text/css" href="../resources/css/ext-all.css" /> 
</head>

歡呼

李

來源

2010-10-15 06:53:45 leebutts

修正了....我傻....編輯QN太... ... Bt仍然在同一個地方......想法？ – MAlex 2010-10-15 07:12:33

更新了我的答案... – leebutts 2010-10-15 07:15:40

Amazin ....這工作李....非常感謝幫助 – MAlex 2010-10-15 07:57:45

將ExtJS與Grails集成時沒有輸出

回答

相關問題