MVC - How are you scripting..?
-
Hi, A really well written article, which I recommend you look at if you haven't at is Journey through the Javascript MVC Jungle[^]. Here's my dilemma. I want all the goodness of controllers, I want strongly typed views and model binding - basically all the best bits of MVC. However, even a fairly simple page will usually require some client side script for showing\hiding elements, confirmation boxes & all that funky stuff that users expect for todays interactive web pages. You normally end up with 'page specific script' which will be a number of event handlers and bindings, with no real structure as such. Backbone, Knockout and many of the other frameworks mentioned in the article I linked address this problem, they allow you to create client side models and bring structure and cohesion to your client script. However, the way they are designed almost relegates MVC to a simple 'web API' to handle RESTful requests and respond with some JSON. You seem to end up moving logic that I believe should be in the 'server side controller' into a 'script controller', which I'm not really happy with. I want a structured script representation of my Model, that wires up all by event handlers for my View and keeps everything in a logical order. But I still want model binding, data annotations, validation and logic in my controller, everything that should be handled by MVC.Net. I want the best of both in other words :) I've read quite a bit on this subject, so I know there are many different options available to me - that's the very point of the link. I'm just interested how others developing in MVC are addressing this problem? Most of the applications I'm working on at the moment are Line Of Business, but they can still have some fairly complex client side functionality. I'm not using any framework at the moment, I'm just namespacing my script and wrapping up some jQuery (i.e. Javascript modular pattern) ... it works, just not sure if it's the best way to be doing things. Any thoughts? Cheers
-
Hi, A really well written article, which I recommend you look at if you haven't at is Journey through the Javascript MVC Jungle[^]. Here's my dilemma. I want all the goodness of controllers, I want strongly typed views and model binding - basically all the best bits of MVC. However, even a fairly simple page will usually require some client side script for showing\hiding elements, confirmation boxes & all that funky stuff that users expect for todays interactive web pages. You normally end up with 'page specific script' which will be a number of event handlers and bindings, with no real structure as such. Backbone, Knockout and many of the other frameworks mentioned in the article I linked address this problem, they allow you to create client side models and bring structure and cohesion to your client script. However, the way they are designed almost relegates MVC to a simple 'web API' to handle RESTful requests and respond with some JSON. You seem to end up moving logic that I believe should be in the 'server side controller' into a 'script controller', which I'm not really happy with. I want a structured script representation of my Model, that wires up all by event handlers for my View and keeps everything in a logical order. But I still want model binding, data annotations, validation and logic in my controller, everything that should be handled by MVC.Net. I want the best of both in other words :) I've read quite a bit on this subject, so I know there are many different options available to me - that's the very point of the link. I'm just interested how others developing in MVC are addressing this problem? Most of the applications I'm working on at the moment are Line Of Business, but they can still have some fairly complex client side functionality. I'm not using any framework at the moment, I'm just namespacing my script and wrapping up some jQuery (i.e. Javascript modular pattern) ... it works, just not sure if it's the best way to be doing things. Any thoughts? Cheers
I'm using revealing module pattern and knockout js file contains viewmodel something like this
// The ViewModel
var viewmodel = function (){
model = ko.mapping.fromJS([]),
init = function(initialData) {
model = initialData;
},
save = function(data, event) {
$.ajax({
// ....
});
},
delete = function(data, event) {
$.ajax({
// ....
});
};
return{
Init : init,
Save : save,
Delete : delete
};
};view contains script to initialize viewModel and bindings
$(document).ready(function () {
viewmodel.Init(Model.toJSON());
ko.applyBindings(viewmodel);
});Not sure if it's the best way but it works.
- Regards -
J O N -
I'm using revealing module pattern and knockout js file contains viewmodel something like this
// The ViewModel
var viewmodel = function (){
model = ko.mapping.fromJS([]),
init = function(initialData) {
model = initialData;
},
save = function(data, event) {
$.ajax({
// ....
});
},
delete = function(data, event) {
$.ajax({
// ....
});
};
return{
Init : init,
Save : save,
Delete : delete
};
};view contains script to initialize viewModel and bindings
$(document).ready(function () {
viewmodel.Init(Model.toJSON());
ko.applyBindings(viewmodel);
});Not sure if it's the best way but it works.
- Regards -
J O NIneresting, how are you managing the
Model.toJSON
line? Is that a call like something from this thread? http://stackoverflow.com/questions/8502146/convert-net-object-to-json-object-in-the-view[^] So in your document ready, you're just serialising the .Net Model to a JSON view model, which is then applied to knockout?
-
Ineresting, how are you managing the
Model.toJSON
line? Is that a call like something from this thread? http://stackoverflow.com/questions/8502146/convert-net-object-to-json-object-in-the-view[^] So in your document ready, you're just serialising the .Net Model to a JSON view model, which is then applied to knockout?
that's exactly right. .NET Model is converted into JSON object and passed on to the Init function. In the Init when we do something like this we get the exact representation of the .NET Model in a javascript object with all items as knockout observables which is nice for a two-way binding.
model = ko.mapping.fromJS(initialData);
or
model = ko.wrap.fromJS(initialData);
- Regards -
J O N