Translation: Using ASP. NET MVC 4, EF, Knockoutjs and Bootstrap design and development site-2

Our Goal: Demand Screen 1: Contact List-View all contacts

1.1 This screen displays all contacts in the database.
1.2 Users can delete any contact.
1.3 The user can edit any contact details.
1.4 Users can create new contacts.

Initial Sketch:

Screen 2: Create a new contact

This page provides a blank page that supports the following actions.

2.1 Users can enter the user's name and email address.
2.2 By clicking the Add button, users can add as many phone numbers as they please.
2.3 The user can delete any phone number of the contact person.
2.4 By clicking the Add Address button, users can add as many addresses as possible to their contacts.
2.5 The user can delete any address of the contact person.
2.6 Click the Save button to save the contact information to the database and return to the contact list page.
2.7 Click the Back button to return to the contact list page.

Initial Sketch:

Screen 3: Update contact information

This page will show you the contact details.

3.1 The user can modify the contact's name, e-mail address.
3.2 By clicking the Add Delete button, the user can modify, add, and delete any phone number for the contact.
3.3 By clicking the Add Delete button, the user can modify, add, and delete any address for the contact.
3.4 Click the Save button to update the contact information to the database and return to the contact list page.
3.5 Click the Back button to return to the contact list page.

Initial Sketch:

Article posted: http://www.cnblogs.com/haogj/

Translation: Using ASP. NET MVC 4, EF, Knockoutjs and Bootstrap design and development site-2