简体   繁体   English

如何读取extjs数据存储

[英]how to read extjs data store

I want to read a particular value of an extjs data store and manipulate it locally. 我想读取extjs数据存储的特​​定值并在本地操作它。 Response xml looks like : 响应xml如下所示:

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

My store will have just one user entry when response is received and i want to read 'bname' value. 我的商店在收到回复时只有一个用户条目,我想读取'bname'值。 So far i have tried two approaches and both giving error. 到目前为止,我尝试了两种方法并且都给出了错误。

approach1: 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'));
    }
});

Running above code gives error that 'Ext.define is not a function'. 在代码上运行会出现“Ext.define不是函数”的错误。

Approach2: 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 },

});

Above code does not display anything on console. 上面的代码在控制台上不显示任何内容。

I am new to extjs and not sure how i can access 'bname' value from response. 我是extjs的新手,不知道如何从响应中访问'bname'值。 It would be great if someone can help 如果有人可以提供帮助,那就太棒了

Take a look at this: 看看这个:

// 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 )

​Or see the working code here: http://jsfiddle.net/lontivero/HTj5Q/ 或者在这里查看工作代码: http//jsfiddle.net/lontivero/HTj5Q/

As you can see, it works fine. 如你所见,它工作正常。 However, if your store will have 'always' just one record, then you shouldn´t use a store, you should use a model and load the model. 但是,如果您的商店将“始终”只有一条记录,那么您不应该使用商店,您应该使用模型并加载模型。

UPDATE : 更新

Ok, if you are using extjs 3.1.1 (it would be good to gave such important information before) you can do it as follow: 好的,如果您使用的是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>

Below code worked for me : 下面的代码对我有用:

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');
});

You are using Ext version 4 code, but your library is 3.1.1 您正在使用Ext版本4代码,但您的库是3.1.1

It simply wouldn't work unless you upgrade your library to version 4. 除非将库升级到版本4,否则它将无法工作。

To make the sample of Lontivero complete, it is also useful to find a record on a specific key with the findRecord method. 要使Lontivero的样本完整,使用findRecord方法在特定键上查找记录也很有用。 As the sample shows below (based on the sample of lontivero), it will only get the first found record. 如下面的示例所示(基于lontivero的样本),它将只获得第一个找到的记录。 So this is very useful if you work with a store with a unique key. 因此,如果您使用具有唯一键的商店,这将非常有用。

You can see this sample live at: http://jsfiddle.net/jvandemerwe/dGUGb/25/ 您可以在以下网址查看此示例: 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+'\'');
}
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');
}
}
});

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM