3 ms·

My company is looking to move one of our core apps from Silverlight/RIA Services to ASPnet MVC/Javascript client and we're looking to use Knockout, since it map

My company is looking to move one of our core apps from Silverlight/RIA Services to ASPnet MVC/Javascript client and we're looking to use Knockout, since it maps well mentally to what we've been doing with XAML in Silverlight. In light of this article, what is a good application structure to use on the client if we do decide to go with Knockout?

derickbailey 15y ago
"It depends" - the only viable answer :D But seriously, it largely does depend on the behavior of your application. If you're going to use Knockout to provide wiz-bang editing and binding on single page (as opposed to a slew of jQuery code everywhere), then you might not need much more than Knockout. If you're going to be creating multi-page JavaScript applications within a single page of your site, you should look at combining something like Backbone.js with Knockout, using the Knockback library I linked to in that article. Alternatively, if your looking for good structure for JavaScript applications in general, I have another post that introduces a few of the concepts and links to some great resources, here: http://derickbailey.lostechies.com http://derickbailey.lostechies.com (unfortunately, I can't get the exact URL at the moment... site seems to be slow / not responding. just look for the "Intro to composite JavaScript apps" post)
IanDrake 15y ago
I've used knockoutjs on a few projects now and I think I could help, but the article is down, so I don't understand the context of your question. There are several way to structure your app, but it depends on what your app does and how structured it is. On a basic level I structure every page to have a page object to handle events and setup the view model(s). So, for default.aspx, I might have something like: var Page = new function(){ _this = this; $(function(){ //document ready }); $("#dataTable").delegate(".delete",function(){ _this.viewModel.deleteItem(ko.dataFor(this)); }); this.viewModel = new function(){ var _this = this; //set up view model this.observableVal = ko.observable(""); this.deleteItem = function(){ //delete item from VM }; }; }; But then you might want to have a page with multiple view models (ie UserControls that are self contained). This gets a bit tricky, especially if you want the multiple view models to interact. Shoot me an email if you need help.

derickbailey 15y ago

"It depends" - the only viable answer :D But seriously, it largely does depend on the behavior of your application. If you're going to use Knockout to provide wiz-bang editing and binding on single page (as opposed to a slew of jQuery code everywhere), then you might not need much more than Knockout. If you're going to be creating multi-page JavaScript applications within a single page of your site, you should look at combining something like Backbone.js with Knockout, using the Knockback library I linked to in that article. Alternatively, if your looking for good structure for JavaScript applications in general, I have another post that introduces a few of the concepts and links to some great resources, here: http://derickbailey.lostechies.com http://derickbailey.lostechies.com (unfortunately, I can't get the exact URL at the moment... site seems to be slow / not responding. just look for the "Intro to composite JavaScript apps" post)

IanDrake 15y ago

I've used knockoutjs on a few projects now and I think I could help, but the article is down, so I don't understand the context of your question. There are several way to structure your app, but it depends on what your app does and how structured it is. On a basic level I structure every page to have a page object to handle events and setup the view model(s). So, for default.aspx, I might have something like: var Page = new function(){ _this = this; $(function(){ //document ready }); $("#dataTable").delegate(".delete",function(){ _this.viewModel.deleteItem(ko.dataFor(this)); }); this.viewModel = new function(){ var _this = this; //set up view model this.observableVal = ko.observable(""); this.deleteItem = function(){ //delete item from VM }; }; }; But then you might want to have a page with multiple view models (ie UserControls that are self contained). This gets a bit tricky, especially if you want the multiple view models to interact. Shoot me an email if you need help.