Tell me more ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.
up vote 0 down vote favorite

I am working on knockout bindings.. I have knockout sorting to implement and i have done this way..

function notesViewModel() {
    _this.colName = "CreatedDate";
    _this.sortOrder = "desc";
    _this.notes = ko.observableArray();

   _this.SortItems = function (colname) {
        var newNotes = _this.notes();
        if (_this.sortOrder === "desc") {
            this.notes(newNotes.sort(notesViewModel._getSortFunction = function (a, b) {
                return a[colname] < b[colname] ? -1 : 1;
            }));
            switchSortOrder();
        } else {
            this.notes(newNotes.sort(notesViewModel._getSortFunction = function (a, b) {
                return a[colname] > b[colname] ? -1 : 1;
            }));
            switchSortOrder();
        }
    };
    function switchSortOrder() {
        if (_this.sortOrder === "asc") {
            _this.sortOrder = "desc";
        } else {
            _this.sortOrder = "asc";
        }
    }
 ko.applyBindings(_this, $("body").get(0));
return _this;
}

and my html code is like this:

<table id="notes" class="notes_table">
        <tr class="head">
        <th data-bind='click: function() { SortItems("CreatedDate")}'>
        <span>Date</span>
        </th>
        <th data-bind='click: function() { SortItems("Type")}'>
        <span>Type</span>
        </th>
        <th data-bind='click: function() { SortItems("Category")}'>
        <span>Category</span>
        </th>
        <th data-bind='click: function() {SortItems("AddedBy")}'>
        <span>Added by</span>
        </th>
        <th>
        <span>Alerts</span>
        </th>
        <th></th>
        </tr>
        <tbody data-bind="template: { name: 'StudentNote', foreach: notes }"></tbody>
    </table>

I want to refactor the sort function to something like this..

_

this.SortItems = function (colname) {
        var newNotes = _this.notes();
        this.notes(newNotes.sort(notesViewModel._getSortFunction = compareFunction (a, b,_this.sortOrder)));

  function comparerFunction(a,b,sortOrder)
 {
     if(sortOrder === "desc")
    {

     return a[colname] < b[colname] ? -1 : 1;
     _this.sortOrder = "asc";

    }
    else
    {
     return a[colname] > b[colname] ? -1 : 1;
     _this.sortOrder = "desc";
    }
 }

};

But it didnt work out as, it was saying that the a and b parameters are not available.. can anyone please tell me how to separe the logic from the anonymous function

share|improve this question

1 Answer

up vote 1 down vote

It looks like you're a bit confused about what anonymous functions are.

What (I think) you're trying to do is have a single function that can be used for sorting both ascending and descending, based on the field "sortOrder" of 'this'.

There are several problems with your code:

  • First, you're calling the function instead of saving it to this.sortOrder. This is why 'a' and 'b' are not available, this function should only be called by the sort algorithm.
  • Second, 'this' will not point to the right place inside your compare function: to have a 'this' object defined in Javascript you need to store the function on an object (or prototype), or use special call semantics. 'this' is tricky in Javascript and it's worth (re)reading some tutorials to make sure you understand it.
  • Finally, you're calling compareFunction before you define it.

This code is along the lines of what you want, though I haven't tested it and I don't know the framework you're using. It stores sortOrder in the outer function before calling sort so that it is available to the inner function.

this.SortItems = function (colname) {
  var sortOrder = this.sortOrder; // make sortOrder available to the sort function
  this.notes(_this.notes().sort(
    function (a, b) {
      return ((sortOrder === "desc") ? 1 : -1) * ((a[colname] < b[colname]) ? -1 : 1);
    }));
};
share|improve this answer
Hi Stephen thanks for ur reply.. Im using asp.net MVC4.. when i tried to use ur suggested code, its giving me "expression staement is not assignment or call". on the sort logic line. – user2288976 Apr 26 at 7:57
I was missing 'return' – Stephen Nelson Apr 27 at 0:00

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.