Home/ Questions/Q 8895277
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-14T23:44:12+00:00

Let’s say the user might pick one div from the set { A, B,

  • 0

Let’s say the user might pick one div from the set { A, B, C } and add it to div X, except each div has a different rule that may be dependent the application state and some intrinsic property of each div. Finally upon adding the div, each div might trigger different events.

for example, in one application state, the user:

try add A to X: A is added to X, nothing else happens

try add B to X: B is added to X, some additional event is triggered

try add C to X: not allowed, C is return to some defined original state ( for example if I try to add C to X by drag and drop, C is returned to original position ).

assume all three divs are already rendered and one model, view and controller exist for each one.

Feel free to tell me the pieces of logic you see in this process and where you would put it. But please answer:

  1. should the validation process sit in the controller layer, or somewhere in the model layer
  2. once validated, should one mediator object call the model and view to add new child, or should the model add the child, and then somehow triggers the view to do the same.
  3. should controllers be aware of hierarchal relationships of the dom and model

I am implementing something like this in Ember.js which has certain ideas about things, but please answer even if you don’t use it/have never heard of it.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    The drag and drop action should be implemented in the view. When the item is dropped it should trigger an action that gets sent to the router. The router (functioning as the app’s state machine) should respond to the action appropriately based on the current state. Deciding the appropriate action can be entirely state-based, or take into consideration aspects of the models or controllers.

    The action should manipulate the model and/or controllers, and bindings/observers in the view layer should bring the view in sync with the new state of the models/controllers.

    Controllers should not be aware of the DOM.

    Hope that helps! I cover the division of responsibilities in a presentation available here: http://www.lukemelia.com/blog/archives/2012/08/23/architecting-ember-js-apps/

    • 0