[Original] Bootstrap + Knockout. JS + ASP. Net MVC3 + PetaPOCO implement CRUD operations, mvc3crud

[Original] Bootstrap + Knockout. JS + ASP. Net MVC3 + PetaPOCO implement CRUD operations, mvc3crud

1. Requirements:

1.1) Beautiful pages

1.2) Front-end code should be concise and clear, and MVC or MVVM framework should be used

1.3) The server must use the MVC Framework and Rest style.

1.4) Use ORM for data access

 

2. effect:

(2.1) List

2.2) Paging

2.3) added

2.4) Modification

3. Technical considerations:

3.1) Considering the beautiful page, Bootstrap is indeed a good choice without an artist.

3.2) the front-end framework selects MVVM's Knockout. JS, probably because Microsoft has built this framework in its own project templates, so it has always been quite fond of it.

3.3) ASP. Net MVC is now available in 5, all kinds of maturity. I use VS2010 and use 3 at will.

3.4) Entity Framework is too heavy. It seems that NHibernate is not updated. Various micro ORM systems are used. Compared with Dapper and Massive, PetaPOCO seems simpler and more convenient.

 

4. Understanding of Knockout. JS:

Please refer to the diagram given by Artech to understand the data flow and processing process.

 

5. framework construction:

Brainless operations: It's okay to put various front-end databases and back-end databases in this way.

 

6. Some technical points:

6.1) Route modification:

Here I only used the personnel ID to pass between pages, so I modified the Global. routes. in MapRoute, the parameter "{controller}/{action}/{PersonID}" is used to receive such Rest-style parameters and define them as PersonID.

6.2) Use of paging controls:

To work with the Bootstrap framework, the pagination control also uses the Bootstrap-style Control (jqPaginator). The Code is slightly modified.

Paging: You need to know the data on the current page, the total number of pages, and the current page. The backend uses the PetaPOCO micro-ORM framework, you can directly obtain the data set of the Page <T> type, and then strip and encapsulate it.

The frontend can set the corresponding attributes to receive the data thrown by the backend.

The page data from the backend is sent to KO's observer object.

Other widgets can be directly paid to the paging control.

When the paging control is clicked, the corresponding query controller and transfer the page value are all done.

 

 

: Http://pan.baidu.com/s/1ntsj4MX