在extjs4中如何获取tree的json数据？

Posted 2023-05-04

我做了一个tree，这个tree的数据是从后台传来的（json格式），现在我对这个tree新增、删除了节点后需要把这个tree修改后的json传回到后台保存，请问tree的json数据如何拿啊？谢谢！
感谢两位朋友的回答，可是我现在是要在前台获得修改后的JSON数据，看EXTJS的API中说的是使用encode方法，可是我试了还是不行~~请帮忙解决~！

var store = Ext.create('Ext.data.TreeStore',
model: 'Demo',
proxy:
type: 'ajax',
url: 'tree.json' //后台json
,
);

前台说白了和后台没多大关系，它只需要 一串json数组（或者xml），不管你用的什么后台。 参考技术A 自定义tStore绑定值后，
通过tStore.tree.root.childNodes可以取出最外层节点数据,在childNodes取出子节点。
给出例子如下:

$.each(tStore.tree.root.childNodes,function(i,it)
$.each(it.childNodes,function(index,item)
if(item.data.text==text)
ftext = item.data.text;

);
); 参考技术B 取tree的store

如何在 extjs4 的网格中显示关联的 json 数据？

【中文标题】如何在 extjs4 的网格中显示关联的 json 数据？

【英文标题】：How to display associated json data in grid in extjs4?

【发布时间】：2013-04-12 11:45:26

【问题描述】：

我在 extjs4 mvc 中工作，我遇到了一些问题。实际上我想在 extjs4 的网格中显示关联的 json 数据。我尝试并搜索了很多，但仍未解决问题。

这是我的一些代码

我的视图文件：

Ext.define('AM.view.user.List' ,
    extend: 'Ext.grid.Panel',
    alias : 'widget.userlist',
    title : 'All Users',
    store: 'Users',
    columns: [
        header: 'Name',  dataIndex: 'name',  flex: 1,
        header: 'Email', dataIndex: 'email', flex: 1,
        header:'title',dataIndex:'title',flex:1       //I tried 
    ]
 );

控制器文件：

Ext.define('AM.controller.Users', 
    extend: 'Ext.app.Controller',
    stores: ['Users'],
    models: ['User','Book'],
    views: ['user.Edit', 'user.List'],
    refs: [
        ref: 'usersPanel',
        selector: 'panel'
    ],
    init: function() 

     this.control(
             'viewport > userlist dataview': 
                 itemdblclick: this.editUser
             ,
             'useredit button[action=save]': 
                 click: this.updateUser
             
         );

    
);

用户模型文件：

 Ext.define('AM.model.User', 
    extend: 'Ext.data.Model',
fields: ['id', 'name', 'email'],
hasMany: 
    model: 'AM.model.Book',
    //model: 'Book', 
    foreignKey: 'userId', 
    name: 'books'
,
proxy: 
    type: 'ajax',
    api: 
        read: 'data/users.json',
        update: 'data/updateUsers.json'
    ,
    reader: 
        type: 'json',
        root: 'users',
        successProperty: 'success'
    

);

用户存储文件：--

Ext.define('AM.store.Users', 
   extend: 'Ext.data.Store',
   model: 'AM.model.User',
   autoLoad: true
);

书籍模型文件：

Ext.define('AM.model.Book',
    extend: 'Ext.data.Model',
    fields: [
        name: 'id', type: 'int',
        name: 'title', type: 'string', //,mapping:'record[0].title'    not working
        name: 'userId', type: 'int'
    ]     
);

json 文件：

"success": "true",
"users": [
    
        "id": "1",
        "name": "shilpa",
        "email": "[e-mail]",
        "books": [
            
                "id": "10",
                "title": "c++",
                "userId": "1"
            
        ]
    
]

这里是截图：

请给我一些建议以在网格中显示相关数据。

【问题讨论】：

您只想显示第一本书的标题？您是希望显示所有相关书籍的标题，以逗号分隔，还是使用两个不同的网格，当您在第一个网格中选择用户时，它会在第二个网格中显示所有相关书籍。

我只是想显示所有相关书籍的标题，用逗号分隔。

【参考方案1】：

您可以访问列渲染器中的所有书籍并构造您需要的字符串。应该是这样的：

    text: 'Books',
    renderer: function (val, meta, record) 
        var books = '';
        record.books().each(function(bookRecord, index, count) 
            books = books + bookRecord.get('title') + ',';
        );
        return books;
    

http://jsfiddle.net/alexrom7/YQXC8/1/