Some Repeater Problems

edited June 2013 in Newbie Questions
I have been messing around with enyo, and am trying to populate a repeater with data from an API call. I keep getting an error in the setupWorlds function though: cannot call method 'setContent' of undefined. Please note i actually used Ares to make this. Not sure what I am doing wrong. see code below:

(removed code, see below post)

Comments

  • edited June 2013
    okay the code in the original post looked crap and was tough to read to second attempt to post it:
    enyo.kind({
    name: "World",
    kind: "enyo.Control",
    published: {
    },
    events: {
    },

    layoutKind: "FittableRowsLayout",

    components: [
    {kind: "onyx.Toolbar", components: [
    {content: "Region"},
    {kind: "onyx.PickerDecorator", name: "worldRegion", onSelect: "getWorlds", components: [
    {},
    {kind: "onyx.Picker", name: "worldRegionOptions", components: [
    {content: "North America", active: true},
    {content: "Europe"}
    ]}
    ]},
    {content: "Language"},
    {kind: "onyx.PickerDecorator", name: "worldLanguage", onSelect: "getWorlds", components: [
    {},
    {kind: "onyx.Picker", name: "worldLanguageOptions", components: [
    {content: "EN", active: true},
    {content: "FR"},
    {content: "DE"},
    {content: "ES"}
    ]}
    ]}
    ]},
    {kind: "enyo.Scroller", fit: true, components: [
    {kind: "enyo.Repeater", name: "worldRepeater", onSetupItem: "setupWorlds", components: [
    {name: "world", components: [
    {tag: "span", name: "worldName"},
    {tag: "span", name: "worldID"}
    ]}
    ]}
    ]}
    ],
    worldArray: '',
    create: function () {
    this.inherited(arguments);
    // initialization code goes here
    },
    rendered: function () {
    this.inherited(arguments);
    this.getWorlds();
    },
    getWorlds: function (inSender, inEvent) {
    //var searchLanguage = this.$.worldLanguageOptions.getSelected().getContent();
    var request = new enyo.Ajax({
    url: "htt" + "ps://api.guildwars2.com/v1/world_names.json?"
    });
    request.response(this, "processWorlds");
    request.go({
    lang: "en"
    });
    },
    processWorlds: function (inRequest, inResponse) {
    if (!inResponse) {
    return;
    }
    this.worldArray = inResponse;
    this.$.worldRepeater.setCount(this.worldArray.length);
    },
    setupWorlds: function(inSender, inEvent) {
    var worldInfo = this.worldArray[inEvent.index];
    this.$.worldName.setContent(worldInfo.name+" --- ");
    this.$.worldID.setContent(worldInfo.id);
    return true;

    }
    });
  • edited June 2013
    Make your setupWorlds call do this:
    setupWorlds: function(inSender, inEvent) {
    var item = inEvent.item;
    var worldInfo = this.worldArray[inEvent.index];
    item.$.worldName.setContent(worldInfo.name+" --- ");
    item.$.worldID.setContent(worldInfo.id);
    return true;
    }
    You need to be setting properties on the item passed in the inEvent, not on the Hello instance.

    (Fixed code formatting by spilling URL into two parts--something with the linkification messed it up)
  • so I added the var item= inEvent.item
    But i still get an error on this line: this.$.worldName.setContent(worldInfo.name+" --- ");
    Error is: Uncaught TypeError: cannot call method 'setContent' of undefined.

    It's as if it's not seeing anything inside my repeater.

    This kind is called by App.js does that affect it in anyway?
  • edited June 2013
    It's because you're still accessing this.$.worldName instead of item.$.worldName, at least according to that error. inEvent.item is the delegate/wrapper control for the item being rendered at that time and named components of that row (worldName, for instance) are owned by that delegate, not this.
  • Thanks guys for the explanations. Solved my issue.
  • thanks so much.
Sign In or Register to comment.