回《【開源】EFW架構系列文章索引》
EFW架構源代碼下載下傳V1.2：http://pan.baidu.com/s/1hcnuA
EFW架構執行個體源代碼下載下傳：http://pan.baidu.com/s/1o6MAKCa
前言：EFW架構主要用于行業軟體軟體開發，是以軟體的界面需要展現專業、漂亮、風格統一的效果；在Web友善這種界面架構還是有不少，如強大的EXT，基于Jquery的JqueryUI，還有一些國産的也都比較漂亮；而EFW架構中推薦的是JqueryEasyUI，為什麼選擇它了，一是界面風格比較合适，控件也很全，已經滿足系統的功能；二是JqueryEasyUI是基于Jquery，對于它的編碼方式是非常舒服的，而且整個架構夠輕量級；三是它的學習成本低，執行個體代碼很全，花得幾個小時熟悉一下就會使用；以前在項目中有用過ExtJS做界面開發，說實話用得比較痛苦，它那種編碼方式不是一般人能接受的，界面都是用JS代碼編寫的，看起來不太直覺，特别大家編碼又不是太規範，日積月累最後一個頁面js也是老長，最後出現對應閉合符号不對都要找半天；現在的項目都是使用JqueryEasyUI開發，那叫一個舒服啊；當然如果還是覺得JqueryEasyUI不夠強大，你可以在EFW架構中非常友善的擴充你自己的界面架構；
本文要點：
1.JqueryEasyUI介紹
2.JqueryEasyUI常用控件使用詳解
3.EFW架構中使用JqueryEasyUI開發的編碼風格
4.在JqueryEasyUI基礎上自定義的控件
jQuery EasyUI是一組基于jQuery的UI插件集合，而jQuery EasyUI的目标就是幫助web開發者更輕松的打造出功能豐富并且美觀的UI界面。開發者不需要編寫複雜的javascript，也不需要對css樣式有深入的了解，開發者需要了解的隻有一些簡單的html标簽。jQuery EasyUI為我們提供了大多數UI控件的使用，如：accordion，combobox，menu，dialog，tabs，validatebox，datagrid，window，tree等等。jQuery EasyUI是基于JQuery的一個前台ui界面的插件，功能相對沒extjs強大，但頁面也是相當好看的。一些功能也足夠開發者使用，相對于extjs更輕量。
特點
1 基于jquery使用者界面插件的集合
2 為一些目前用于互動的js應用提供必要的功能
3 使用 EasyUI你不需要寫很多的javascript代碼，通常隻需要寫HTML标記來定義使用者界面即可
4 支援HTML5
5 開發産品時可節省時間和資源
6 簡單，但很強大
7 支援擴充，可根據自己的需求擴充控件
8 目前各項不足正已版本遞增的方式不斷完善
接下來我們結合EFW架構來詳細講解JqueryEasyUI的控件如何使用；同時根據自己結合自己對它的了解挑選幾個有代表性的控件；頁面中使用控件前必須先引用幾個JqueryEasyUI的檔案；
1）Layout布局控件
學習一套控件首先要掌握的就是布局控件，分别上下、左右、居中等，還有嵌套布局，比如在居中面闆再分為上下布局；布局用得好對以後得界面調整是非常友善，代碼也看上去更加清晰漂亮；編寫一個<div>标簽且class="easyui-layout"，這樣就表示把div層變成一個布局控件，所有其他控件的代碼編寫都是這種方式使用；
2）datagrid表格控件
表格控件在系統中用得最多的一個控件，在Winform中就有datagridview表格控件，隻需将DataTable資料綁定給DataGridView就可以顯示資料非常簡單；而datagrid是bs的，肯定沒有這麼友善，但EFW架構也把它封裝得使用起來非常友善；首先編寫datagrid界面代碼，定義好顯示列，然後在js代碼中給控件的url屬性指定請求位址，利用jquery的ajax發送http請求調用背景WebController，傳回Json資料顯示在datagrid控件；
3）Dialog彈窗控件
這個控件也是用的非常多的，比如新增、修改操作的時候更偏向于彈出一個小界面進行操作；
其他更多控件學習參考：http://www.jeasyui.com
JqueryEasyUI代碼編寫有兩種風格，一種是用html标簽編寫界面代碼，還有一種可以編寫js代碼動态生成界面，從上面的控件舉例就能看出，個人堅持一定要采用第一種方式編寫界面代碼，js代碼隻是一些資料請求操作；
介紹兩個自己的兩個控件，是基于JqueryEasyUI之上擴充的，給需要自己開發控件的提供兩個示例，有個參考的東西；一個是在日期控件上的擴充控件，可以按月查、按季度查、按上下半年查、按年度查；另一個是把表格控件用卡片的形式展現；代碼放在EFWWeb項目中的WebPlugin目錄。