ASP.NET-FineUI開發實踐-9

標籤：style   blog   http   color   io   sp   div   2014   on   

用了FineUI有一段時間了，還是分享下我咋改的吧，沒想的那麼難，我也是從小白來的。

基礎是要懂JQ和EXTJS，主要是要懂JQ和EXTJS能幹啥，這裡有兩個網站http://www.w3school.com.cn/jquery/traversing_find.asphttp://extjs-doc-cn.github.io/ext4api/http://www.fineui.com/api/1. 都爛大街了，JQ的肯定要看一遍，核心的是JQ選取器和事件，動畫啥的感興趣的可以都研究，JQ能通過各種樣式、ID、屬性獲得元素，元素包括各種控制項還可以找到子控制項，只要是HTML上的沒有找不到的；事件，使用者操作觸發的就是事件，各種事件的交織讓HTML不死，比如點擊，雙擊，獲得焦點，值改變等；除此之外JQ還可以重寫HTML，屬性，樣式，得到了就能改。2.EXTJS基於JQ，還有API，寫了一個一個的類，包成控制項，一個新的執行個體就是一個控制項，事件及屬性API上都有，都能找到，FineUI也基於EXTJS看起來就方便了。FineUI官方的執行個體裡沒有js，既然基於EXTJS怎麼也沒上沒有JS呢，JS都寫在FineUI.dll裡了，底層是extjs.js，只要建立執行個體就可以了，這就要用到asp.net的生命週期的一部分，也很好理解，就是在也沒顯示之前幹了一件事，把頁面上寫的FineUI控制項轉成EXTJS再由extjs.js進行渲染顯示頁面，當然渲染要涉及css和圖片，渲染的意思就是變成了HTML代碼，DIV加CSS，所以HTML基礎肯定要有。3.FineUI的api其實不想寫的，這個不看就不要用了，各種屬性事件都不知道幹啥的，怎麼用，實在看不懂就把屬性加上再刪除看看有什麼區別。見圖：  這個圖不是第一次截了，在頁面上的沒有頁面都有，比如我的頁面上有個取消按鈕： OK，我看見了什麼，Button產生的extjs格式是個啥樣的，顯示的文字就是text屬性，事件寫在了handler裡，我寫的是點擊事件showhide那麼handler就是點擊事件的意思，這個圖不知道是哪的我就白寫了；我還看見了所有的控制項都在 F.ready(function () {，裡寫的，我搜了下項目，在grid_checkboxfield_rowcheckall_clientside裡找到了F.ready(function () {分析下，‘<%= btnSelectRows.ClientID %>‘ASP.NET的獨特寫法，擷取控制項的ID是HTML的ID，就像的Button2，產生的ID是Grid1_Button2，on(‘click‘)是綁定單擊事件，那麼F(selectRowsID)就是通過ID獲得對象，這裡就叫對象吧。後面的就是方法，匿名函數，就是沒名，我也是蹭課才知道的。一看見$就是JQ用的，選取器，.開頭的就是class名 img是標籤又一個類名，得到元素後再方法XXX，恩，這個頁面不運行也知道幹嘛的，checked是選擇的意思，這個頁是控制grid行裡checkbox的選擇狀態的，都是單詞，簡單。這說明啥，官方的例子也有用js控制的功能，而且很方便，比後台再回傳快多了（有的功能沒必要回傳）。今天晚了，明天我會再發一個表單通過js添加元素的例子，大家一起學習。   

ASP.NET-FineUI開發實踐-9