what's wrong in fetch data from collection using ajax source

Hi all,
i create a custom collection with ajax source to fetch data from server and binding to view, but cannot working, please help me.

Collection:
new enyo.AjaxSource({name:'source'});

enyo.kind({
name:'clip.GroupCollection',
kind:'enyo.Collection',
source:'source',
model:"clip.VideoModel",
published: {
category: null,
},
categoryChanged: function() {
this.empty({destroy:true});
if(this.category =='home') {
return this.fetch();
}
},
options: { parse: true },
parse: function(data) {
return data && data.result;
},
getUrl: function() {
return "http://api.xxx.vn/app/home/get_groups?id=" + this.get("userid");
}
});


View:

enyo.kind({
name:'clip.HomeContent',
kind:'FittableRows',
fit:true,
spotlight:'container',
components:[
{
kind:'moon.Button',content:'click',ontap:'tapped'
},
{
name:'clipNewest',
kind:'clip.ItemHome',
}
],
create:function(){
this.inherited(arguments);
this.set('collection',new clip.GroupCollection());
},
bindings:[
{
from:"collection",
to:"$.clipNewest.model",
transform:function(data){
console.log('transform data',this.collection);
if(this.collection && this.collection.length>0 && this.collection.at(0)){
console.log('newest',this.collection.at(0));
return this.collection.at(0);
}
}
}
],
tapped:function(){
console.log('tap');
this.collection.set('category','home');
}
});


what's happen when i click detail collection in console log, before show detail, length=0, models=0, but click show detail length=4, models=array(4)
link image: http://postimg.org/image/pajub3dcx/
image

Comments

  • You are binding from collection rather than collection status or collection length or collection models. Once you set the collection, it does not change, even after fetch , since it is the same object in memory. Would recommend passing in a success handler to fetch or using something bound to status to trigger your update.
  • many thanks @psarin
    i change binding by collection length and working now.
    bindings:[
    {
    from:"collection.length",
    to:"$.clipNewest.model",
    transform:function(data){
    console.log('transform data',this.collection);
    if(this.collection && this.collection.length>0 && this.collection.at(0)){
    console.log('newest',this.collection.at(0));
    return this.collection.at(0);
    }
    }
    },
    ]
Sign In or Register to comment.