Explain MVC architecture of extjs

Question

I created a small sudoku app using Javascript. Now I am trying to convert that javascript code into extjs (4.1.1a) code. I have gone through the docs to understand the

Answer 1

First, you should have a good understanding of how MVC works before attempting to implement it, especially in Ext JS which had MVC support tacked on in a recent version.

Speaking in the general sense (since you're the only one who really knows your code), I would separate the code as such:

• Model: A 9x9 matrix of data values (or a 3x3 matrix of 3x3 matrices), a validation method that determines if the puzzle is solved or if there are any errors in the user input (eg. two 6's in a box), and possibly undo support.

• View: Your container above. The controller should have no idea how the container displays values. I'd probably send my own sudoku-specific events like cellchanged(container, x, y, newValue, oldValue) and undo(container).

• Controller: Listens for the sudoku-specific events in the view and updates the model accordingly. After each update, validates the model to see if the puzzle has been solved or if certain cells are incorrect. Should not act as a relay for all view events. Events like render and resize aren't relevant to the sudoku controller. Only listen for what you actually need.