Making Modular, Reusable and Loosely Coupled MVC Components
- by Dusan
I am building MVC3 application and need some general guidelines on how
to manage complex client side interaction between my components.
Here is my definition of one component in general way:
Component which has it's own controller, model and view. All of the
component's logic is placed inside these three parts and component is
sort of "standalone", it contains it's own form, data needed for
interaction, updates itself with Ajax and so on.
Beside this internal logic and behavior of the component, it needs to
be able to "Talk" to the outside world. By this I mean it should
provide data and events (sort of) so when this component gets embedded
in pages can notify other components which then can update based on
the current state and data.
I have an idea to use client ViewModel (in java-script) which would
hookup all relevant components on page and control interaction between
them. This would make components reusable, modular - independent of
the context in which they are used.
How would you do this, I am a bit stuck as I do not know if this is a
good approach and there is a technical possibility to achieve this
using java-script/jquery. The confusing part is about update via Ajax,
how to ensure that component is properly linked to ViewModel when
component is Ajax updated (or even worse removed or dynamically
added). Also, how should this ViewModel be constructed and which
technicalities to use here and in components to work as synergy???
On the web, I have found the various examples of the similar approach,
but they are oversimplified (even for dummies) or over specific and do
not provide valuable resource or general solution for this kind of
implementation. If you have some serious examples it would be, also,
very helpful.
Note: My aim is to make interactions between many components on the
same page simpler and more robust and elegant.
