knockout 和mvc4结合使用

Knockout (或者Knockout.js
，KnockoutJS)是一个开源的JavaScript库，网址为www.knockoutjs.com。Knockout语法简洁、可读性好，能轻松实现与DOM元素的关联。一旦数据模型的状态发生改变，则立即自动刷新UI。Knockout采用Model-View-View-Model
(MVVM)的设计模式来简化动态JavaScript UI。Knockout有效实现了JavaScript与UI
HTML呈现的分离。有了Knockout，在写JavaScript时，就不需要在页面中引用UI元素或DOM。

　　Knockout设计目标是把任何JavaScript对象当成View Model来使用。只要View
Model的属性具有可监听性，就可以使用Knockout将其与UI绑定。一旦属性值发生变化时，UI会被自动刷新。

　　Order Entry Header – 编辑模式与显示模式

　　Order Header页面的关键功能是，在不重复提交整个页面的前提下，自由切换编辑模式与显示模式。ASP.NET
post-back模式通常表现为：用户点击Edit按钮，post提交至服务器，返回后，整个页面被重新刷新。使用Knockout与MVVM数据绑定技术，则可以避免页面重新刷新。这里，我们需要做的仅仅是将Order
Header页面去绑定JavaScript创建的View Model。

　　数据绑定标签

　　为创建一个MVC View来回切换只读与编辑模式，我们为页面的每一个元素都创建单独的DIV与SPAN标签。一个(编辑模式)包含INPUT
HTML控件，另一个(只读)只显示文本。添加Knockout数据绑定标签可以灵活控制HTML元素何时被显示，何时被隐藏。下例中，ShipName
包含一个两个数据绑定标签，前者关联Ship Name的值，后者是一个布尔标签，控制只读或编辑模式。

　　

#div_code img{border:0px;}

, "ProductName", "ASC");
}

function ProductSelected(productID)
{
GetProductInformation(productID);
}

</script>

　总结

　　ASP.NET
MVC是一个适用于大型Web应用开发的日益成熟的Web框架。MVC的架构思想是注重分离，对于具有Trial、Error、Discovery的Web应用开发而言，MVC的学习曲线就显得与众不同。MVC与我们过去一直使用的ASP.NET
Web Forms技术与Web Form post-back
model技术完全不同。在未来，MVC开发者需要更加注重新兴框架与开源库，增强型MVC的开发。

　　本文重点关注的是开源JavaScript库Knockout与JQuery，以及用于交换视图与控制器数据的JSON。建议MVC开发者也多多关注其它的开发工具与框架，特别是Backbone与JavaScriptMVC。作为比较，后续的文章将会在示例程序Northwind中引入Backbone与JavaScriptMVC。