在Sencha上列出json中的数据 [英] List data from json on Sencha

问题描述

我正在尝试显示来自Web服务器json的数据，但该数据未在视图中显示.起初，我尝试仅显示消息，但未成功.遵循此链接和@rdougan提供的示例能够解析最多类别，但无法解析后一个值可以指导我. 我到目前为止所做的代码如下:

i am trying to show data from webserver json and it is not shown in view. At first i tried to show message only but could not succed. following this link and sample provided by @rdougan i have been able to parse upto categories but unable parse latter value can any one guide me. code i have done till now are as follow:

{
    xtype: 'panel',
    padding: '20px',        
    //height: 100,        
    styleHtmlContent:true,
    store: 'TodaysWordStore',
    models: 'TodaysWordModel',

        tpl: 
        [
        '<tpl for=".">',
        '<ul class="parabox">',
        '<li><h2 onclick = "ratingStar()">{message} </h2> ',
        '<ul class="para-box-wrapper">',
        '<li class="greenbox"><div class="paragraph-def">',
        '{dictionaryDef}',
        '<span class="authorBox">Author: {authorName}</span>',
        '</div><div class="starBox">',
        '{ratingBox}',
        '</div></li>',
        '</ul></li></ul>', 
        '</tpl>',
        ]
       // '<div><strong>{dictionaryWord}</strong>, {dictionaryDef} <em class="muted">({role})</em></div></tpl>']
  },

我的商店是

Ext.define('appname.store.TodaysWordStore',{
extend: 'Ext.data.Store', 

config:
{
model: 'appname.model.TodaysWordModel',
autoLoad:true,
proxy:
{
    type: 'ajax',
    url : 'location' //Your file containing json data
    reader:
    {
        type: 'json',
            //rootProperty:'accountInfo'
    }
}
}
});

我的模特是

Ext.define('appname.model.TodaysWordModel', {
extend: 'Ext.data.Model',
config: {
fields:[

   {name: 'message', mapping: 'accountInfo.message'}
]
}
});

我要解析的json

 ({"accountInfo":
{"expire_date":"2014-07-02 08:01:09",
"subscribe_date":"2013-07-02 08:01:09",
"time_remain":" 358 Days 1 Hour 24 Minutes",
"status":"not expired"},
"status":"TRUE",
 "message":"Todays Word",
"data":
[{"name":"curtain",
"author":"admin",
"word_id":"35",
"category":"business",
"definition":
[{"rating":
{"red":"0",
"green":"1",
"yellow":"0",   
"total_rating":1,
"final_rating":"Green"},
"defintion":"curtain",
"def_id":"11",
"example":"This is a sample example.",
"author":"admin"},
{"rating":
{"red":0,
"green":0,
"yellow":0,
"total_rating":0,
"final_rating":"This definition is not rated yet."},
"defintion":"to cover something",
"def_id":null,
"example":"This is curtain example.",
"author":"admin"}],
"is_favourite":"No"}]})

帮帮我

推荐答案

我通过添加一个额外的itemTpl解决了它.由于我只有tpl的数据，所以无法从定义节点中获取数据.

I solved it by adding an extra itemTpl. Since i had tpl for data only it was not able to fetch data from definitions node.

{
   xtype: 'list',
   store: 'ghak',
   height: 140,
   layout: 'fit',
  scrollable: {  
        direction: 'vertical',
        directionLock: true,
      },
       margin: '0 0 5px 0',

       itemTpl: [
       '<div>',                
       '<tpl for="data">',
       '<ul class="parabox">',
       '<li><h2 class="noStar" onclick = "addtofavourite({word_id})">{name} </h2>',                          
       '<tpl for="definitions">',
       '<ul class="para-box-wrapper">',
       '<li class="{rating}"><div class="paragraph-def" onclick = "rating({def_id})">','{defintion}',
       '<span class="authorBox">Author: {author}</span>',

       '</li>' ,
    '</div>',
    '</ul></li>', 
    '</tpl>',
    '</ul>',
    '</tpl>',
    '</div>'
    ].join('')

希望这会对某人有所帮助. 谢谢.

Hope it would help someone. Thanks.

这篇关于在Sencha上列出json中的数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！