Simple Application using Knockout.js, jQuery and ASP.NET MVC 4.0 with WEB API

Based on: http://www.dotnetcurry.com/ShowArticle.aspx?ID=847

Create a new database Company and run the script to create a new table [EmployeeInfo]
image

Create a new Internet MVC 4 project, name it [MVC40_Knockout_App], and download knockout,js from NuGet. (or update KO version)

Use EF Power Tool’s Reverse Engineer to import the Company database into the project. After that, under /Models you can see the DbContext file, and the [EmployeeInfo] model class. Also a [CompanyContext] has been added to the web.config. Build the project so the [Employeeinfo] class is visible to the controller wizard.
image
image
Create a new API controller:
image
In the new API controller you get GET/POST/PUT/DELETE method which you can access via jQuery/Ajax.
Next, create a new empty  EmployeeController
Add this method:
image
Add a new view Create.cshtml – empty view, no model. Update the CSS file per instructed.
Next, make sure add the KO and KO Mapping to the Create.cshtml
image
Make sure you include the new “KO” bundle in the _Layout.cshtml.
image
Copy the HTML (Create Employee Form) into Create.cshtml. Compile and browse, and you should the form page:
image
great example On ASP.NET MVC/Knockout!!!
00:37am, 01/29/2013

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s