How to use jQuery in MVC Architecture?

Question

We know that MVC is a software architecture standard (Pattern design) which makes a separation of:

• Vision (User interface),
• Template (Business rules),
• Controller that performs communication between the two.

Of course, MVC can be adopted as a template to create your own architectural style to solve some more specific problem.

Example Project 1:

Directories :

> Model
> Controller
> View
  > UX
  

Diagram of Execution:

View UX Controller Model

User enters registration data in the View, when sending is passed to jQuery UX which is done the validation of client-side information and sent to the controller, the controller just redirects to the model that makes the server-side validations.

Example Project 2:

Directories :

> Model
> Controller
> View
  

Diagram of Execution:

View Controller Model

User enters registration data in View, when sending is passed to jQuery Controller that is made the validation of client side information and sent the model that makes the server side validations.

When I questioned why to carry out this separation the answers were like this:

Project 1:

jQuery is part of the user interaction, so it is present in the view.

Project 2:

jQuery performs all the interaction but also communicates with the model through ajax.

So my question is, where does jQuery go? And what certain tasks he must accomplish in this architecture?

Answer 1

jQuery was created to manipulate DOM, meaning a priori it acts as part of the view. A good solution for this would be to use Angularjs, Ember or React.

If you really need jQuery, use it together with one of the 3 frameworks above.

Answer 2

jQuery is View, simple as that!

jQuery is client-side, where modifications can be made and manipulating information.

The jquery website itself says:

jQuery is a quick, small and feature-rich Javascript library. This makes things like HTML document passthrough and manipulation, event handling, animation and Ajax much simpler with an easy-to-use API that works through a multitude of browsers. With a combination of versatility and extension capability, jQuery has changed the way millions of people write Javascript.
-jQuery (Google Translation)

jQuery performs all the interaction but also communicates with the layer of models through ajax.

If this is happening, even not knowing how, there is something wrong with your model. Any external request goes through the control layer first, and the same that communicates with the template layer. The request Ajax makes only the request, in the same way as a click on a button submit, so to speak.

So my question is this, where does jQuery go? And what certain tasks it should accomplish in this architecture?

jQuery goes to View to perform N functions, but in none of them it will communicate with the layer of models. What you may be doing is making a request to a controller and the same "responding" but you are not "talking" directly to the Model.