Sunday 15 July 2012

javascript - Inheritance and overriding Knockout computed observable -



javascript - Inheritance and overriding Knockout computed observable -

i've been working on making javascript app more scaleable. app uses knockout.js bind grid of type of database item editted , updated user. i'm going downwards path of working inheritance , having basemodel , models inherit that. problem i'm having comes in when want override computed observable defined in basemodel class inherits it. heres utilize case.

base grid has computed observable ui binds to. computed observable works off observable array text box filter user can type search with. pretty basic.

the kid class, roles, specific type of grid , part of business requirement have filter department. drop downwards in ui. want override computed observerable in base of operations class roles implementation in kid class. not sure how accomplish that.

here jsfiddle: http://jsfiddle.net/icestorm0141/vx6843pt/6/

the basegridviewmodel:

var basegridviewmodel = function (serverdata) { var self = this; //searchterm text box user types search self.searchterm = ko.observable(); //items info server self.items = ko.mapping.fromjs(serverdata, mapping); //filtereditems filtered list of items grid bound //thus when user searches, ui updates automatically self.filtereditems = ko.computed(function () { if (self.searchterm() == null || self.searchterm() == "" || self.searchterm().length < 3) { homecoming self.items(); } else { homecoming ko.utils.arrayfilter(self.items(), function (item) { homecoming item.description().tolowercase().indexof(self.searchterm().tolowercase()) >= 0; }); } }); }

the kid class:

var rolegridmodel = function (roledata) { var self = this; //calling base of operations model, think proper way this? basegridviewmodel.call(self, roledata); //ui has drop downwards list of departments filter by, selected filter self.departmentfilter = ko.observable(); //i want set filter function items different var filteroverride = function () { if (self.departmentfilter() == null || self.departmentfilter() == "") { homecoming self.items(); } else { homecoming ko.utils.arrayfilter(self.items(), function (role) { homecoming role.departmentid() == self.departmentfilter(); }); } }; }

i've been doing lot of research lastly few days , i'm surprised haven't come across solution yet. dont sense i'm doing extraordinary maybe has suggestions. i'm open any!

you need override filtereditems:

self.filtereditems = ko.computed(filteroverride);

see fiddle

javascript inheritance knockout.js computed-observable

No comments:

Post a Comment