Question

我想读取extjs数据存储的特定值并在本地操作它。响应xml如下所示：

<user><name>abc</name><surname>def</surname><book><bname>book1</bname></book></user>

我的商店在收到回复时只有一个用户条目，我想读取'bname'值。到目前为止，我尝试了两种方法并且都给出了错误。

approach1：

Ext.define('user', {
     extend: 'Ext.data.Model',
     fields: [ 'name', 'surname'],
     hasMany: {model: 'Book', name: 'book'},
      proxy: {
        type: 'rest',
         url : request,
         reader: { type: 'json', root: 'user'}
     }
 });
 Ext.define('Book', {
     extend: 'Ext.data.Model',
     fields: [ 'name'],
     belongsTo: 'user'
 });
 var userstore = Ext.create('Ext.data.Store', {
        model: "user"
 });
 incidentstore.load({
     callback: function() {
        var inc = userstore.first();
        var bk = inc.getBook();
        console.log(dev.get('bname'));
    }
});

在代码上运行会出现'Ext.define不是函数'的错误。

Approach2：

var proxy1 = new Jx.JxHttpProxyRest({
    url: request,
    api : {
            read : { headers : {     'Accept' : APP + '.abc.def.usermanage.user+json;version=1' } }
        }
    });

var reader = new Ext.data.XmlReader( {
    rootProperty : 'user',
    record : 'book',
    id : 'id',
}, [{ name : 'bname', mapping : 'book > bname'} ]);

var writer = new Ext.data.XmlWriter( {
    encode : false
});

var newstore = new Ext.data.Store( {
    id : 'book',
    restful : true,
    proxy : proxy1,
    remoteSort : true,
    reader : reader,
    writer : writer,
    autoload: true,
    listeners: {
        load: function() {
            console.log(newstore.data.first());
        }
    }
});
Ext.data.DataProxy.addListener('load', function(proxy, type, action, options, res) {
    console.log(res.responseText);
});
newstore.load( {
    params : { start : 0, limit : myPageSize },

});

以上代码不会在控制台上显示任何内容。

我是extjs的新手，不知道如何从响应中访问'bname'值。如果有人可以提供帮助那就太好了

Answer 1

看看这个：

// The user model definition
Ext.define('user', {
   extend: 'Ext.data.Model',
   fields: [ 'name', 'surname', 'book' ]
});

// The store instance
var userstore = Ext.create('Ext.data.Store', {
   model: 'user',
   proxy: {
        type: 'memory',
        reader: {
            type: 'xml',
            record: 'user',
            root: 'users'
        }
    }
});

// data sample to test the approach
mydata =
    [
        ['Juan', 'Alonso', [ { bname: 'El loco' }, { bname: 'El cuerdo' } ]],
        ['Susana', 'Cabrera', [ { bname: 'Adios a las palomas' }]]
    ];

// load the store with the sample data 
userstore.loadData(mydata, false);  

// display the first book for the first record
var firstRecord = userstore.getAt(0);
var firstBook = firstRecord.get('book')[0]; 
alert(firstBook.bname )

或者在此处查看工作代码：http://jsfiddle.net/lontivero/HTj5Q/

如您所见，它运作正常。但是，如果您的商店“总是”只有一条记录，那么您不应该使用商店，您应该使用模型并加载模型。

<强>更新：

好的，如果您使用的是extjs 3.1.1（以前提供这些重要信息会很好），您可以按照以下步骤操作：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
      <title>For extjs 3.1.1</title>

        <script src="http://extjs-public.googlecode.com/svn/tags/extjs-3.1.1/release/adapter/ext/ext-base.js" type="text/javascript" ></script>
        <script src="http://extjs-public.googlecode.com/svn/tags/extjs-3.1.1/release/ext-all.js" type="text/javascript" ></script>
    </head>
    <body>
        <script type="text/javascript">
        Ext.onReady(function(){
            // The store instance
            var userstore = new Ext.data.ArrayStore({
                 fields: ['name', 'surname', 'book'],
                 reader: new Ext.data.ArrayReader({
                     idIndex: 0  // id for each record will be the first element
                 })
            });

            // data sample to test the approach
            mydata =
                 [
                      ['Juan', 'Alonso', [ { bname: 'El loco' }, { bname: 'El cuerdo' } ]],
                      ['Susana', 'Cabrera', [ { bname: 'Adios a las palomas' }]]
                 ];

            // load the store with the sample data 
            userstore.loadData(mydata, false);  

            // display the first book for the first record
            var firstRecord = userstore.getAt(0);
            var firstBook = firstRecord.get('book')[0]; 
            alert(firstBook.bname );
        });

        </script>
    </body>
</html>

Answer 2

以下代码对我有用：

var newproxy = new Ext4.data.proxy.Rest({
    url : request,
    headers : {
        },
    reader :  {
        type : 'json',
        root : 'user.book'
    }});

 // Typical Store collecting the Proxy, Reader and Writer together.
 var newstore = Ext4.create('Ext4.data.Store', {
     id : 'book',
     fields: ['bname'],
     restful : true, // <-- This Store is RESTful
     autoLoad : true,
     proxy : newproxy
 });

var book;
newstore.load();
newstore.each(function(rec) {
    book= rec.get('bname');
});

Answer 3

您正在使用Ext版本4代码，但您的库是3.1.1

除非您将库升级到版本4，否则它将无法工作。

Answer 4

要使Lontivero的样本完整，使用findRecord方法查找特定键的记录也很有用。如下面的示例所示（基于lontivero的样本），它将只获得第一个找到的记录。因此，如果您使用具有唯一键的商店，这将非常有用。

您可以在以下位置查看此示例：http://jsfiddle.net/jvandemerwe/dGUGb/25/

// The user model definition
Ext.define('user', {
   extend: 'Ext.data.Model',
   fields: [ 'name', 'surname', 'book' ]
});

// The store instance
var userstore = Ext.create('Ext.data.Store', {
   model: 'user',
   proxy: {
        type: 'memory',
        reader: {
            type: 'xml',
            record: 'user',
            root: 'users'
        }
    }
}); 

// data sample to test the approach
mydata =
    [
        ['Juan', 'Alonso', [ { bname: 'El loco' }, { bname: 'El cuerdo' } ]], 
        ['Juan', 'Lopez', [ { bname: 'Superdooper' }, { bname: 'Swinglist' } ]],  
        ['Susana', 'Cabrera', [ { bname: 'Adios a las palomas' }]]
    ];

// load the store with the sample data 
userstore.loadData(mydata, false);  

// Finds the first!!! matching Record in this store by a specific field value.
// API info: findRecord( fieldName, value, [startIndex], [anyMatch], [caseSensitive], [exactMatch] )

var keyToFind = 'Juan';
var found = userstore.findRecord('name', keyToFind, 0, false, false, true);

if (found != null) {

    var list = '';
    var author = found.get('name')+' '+ found.get('surname');
    var books = found.get('book');

    Ext.each(books, function(book, idx) {
        if (list != '') list = list + ', ';
        list = list+book.bname;
    });

    alert('Books of '+author+'\n'+list);
} else {
    alert('no books with key \''+keyToFind+'\'');
}

Answer 5

var departmentStore = Ext.create('Ext.data.Store', {
fields : [
'name',
'active',
'dateActive',
'dateInactive',
'description',
'director',
'numEmployees',
{
name : 'id',
type : 'int'
}
],
proxy : {
type : 'ajax',
url : 'data.json',
reader : {
type : 'json',
root : 'data',
idProperty : 'id',
//successProperty : 'meta.success'  //???
}
}
});

departmentStore.load({
callback : function(records, operation, successful) {
if (successful) {
console.log('department name:',
records[0].get('name'));
}
else {
console.log('the server reported an error');
}
}
});

如何读取extjs数据存储

5 个答案: