Ember view doesn't update after ArrayController is sorted

Question

I have an Ember Array Controller that is binded to Ember select view that gets sorted by the user if they choose to. Once everything runs through my sort and I reset the array with the now sorted array the view doesn't change but if I loop through the array that I just set, it shows that it is sorted. So the view isn't updating with the array controller, I believe. I was looking at other posts with similar problems but none of the solutions from them worked for me.

dmp: Ember.ArrayController.create(),
tempArray: new Array(),

sort: function() {
        debugger;
        var self = this;
        var textA, textB, i, t, pos, temp;
        this.set('tempArray',  self.dmp.get('content'));
        var nxt;
        for(t = 0; t < (self.get('tempArray').length) - 1; t++) {
            nxt = this.get('tempArray')[t];
            for(i = t; i < self.get('tempArray').length; i++) {
                if(self.get('tempArray')[i].name.toUpperCase() <= nxt.name.toUpperCase()) {
                    nxt = self.get('tempArray')[i];
                    pos = i;
                }
            }
            temp = self.get('tempArray')[t];
            self.get('tempArray')[t] = nxt;
            self.get('tempArray')[pos] = temp;
        }
        //App.defRouteSearch.dmpName.set('content', self.get('tempArray'));
        //App.defRouteSearch.dmp.set('content', self.get('tempArray'));
        self.setArray();
    }, 

setArray: function() {
        debugger;
        var a = 0, b = 1;
        var self = this;
        while(a < this.get('tempArray').length) {
            self.get('dmp').toArray[b] = self.get('tempArray')[a];
            a++;
            b++;
        }
    }

I switch everything over to a normal js array because it's quicker to manipulate data than compared to the Array Controller, I do this throughout the rest of my code when filling the 6 other arrays I have so that's not causing any problems. The commented code was what I was doing before to set the array. Thanks for any help.

chopper · Accepted Answer · 2013-09-20 19:50:14Z

2

No need to do all of this. This should do the trick:

App.MyArrayController = Ember.ArrayController.create({
  content: songs,
  sortProperties: ['name'],
  sortAscending: true
});

answered Sep 20, 2013 at 19:50

chopper

6,7397 gold badges40 silver badges56 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

user2592413 Over a year ago

It's still not updating, the array sorts its self but because it needs to be sorted in one of two ways I would still need to swap it out. Is there a way for me to switch it directly instead? I already have my array, can I just say this.myArrayController.set('sortProperties', name) I guess it would make sense to try it on my own after posting this.......

chopper Over a year ago

Could you put together a jsFiddle?

user2592413 Over a year ago

I'll try to later tonight when I'm not at work. Thank you for the help

user2592413 · Accepted Answer · 2013-09-24 20:41:09Z

I was able to get it to work after a while. Here's my sort now

sortName: function() {
        var self = this;
        var i, t, pos, temp;
        this.set('tempArray', new Array());
        this.set('tempArray',  self.dmp.get('content'));
        var nxt;
        for(t = 0; t < (self.get('tempArray').length) - 1; t++) {
            nxt = this.get('tempArray')[t];
            for(i = t; i < self.get('tempArray').length; i++) {
                if(self.get('tempArray')[i].name.toUpperCase() <= nxt.name.toUpperCase()) {
                    nxt = self.get('tempArray')[i];
                    pos = i;
                }
            }
            temp = self.get('tempArray')[t];
            self.get('tempArray')[t] = nxt;
            self.get('tempArray')[pos] = temp;
        }
        self.dmp.set('content', self.tempArray.clone());
    }, 

Array.prototype.clone = function () {
    var newObj = [];
    for (i in this) {
        if (this[i]) {
            if ($.isPlainObject(this[i])) {
                newObj[i] = $.extend(true, {}, this[i]);
            }
            else if ($.isArray(this[i])) {
                this[i].clone();
            }
            else {
                newObj[i] = this[i];
            }
        }        
    }
    return newObj;
};

I'm not entirely sure why it works but it does. The small bit of reasoning I was able to come up with is that in js when you copy an array it's only referenced and not actually copied. But then I shouldn't need the clone() at the end since the referenced array was modified. Feel free to correct me if I'm wrong.

Collectives™ on Stack Overflow

Ember view doesn't update after ArrayController is sorted

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related