easyUI常見屬性
阿新 • • 發佈:2018-12-23
4、input/textarea easyui-validatebox 生成欄位驗證。
屬性如下:
1)required:true[必需] false[不必需] 預設false
2)validType:
a、length[a,b] 欄位長度控制在a至b之間。
b、email 驗證Email。
c、url 驗證網路地址。
3)missingMessage:當文字時出現空時彈出該工具提示,系統有預設[英文],自定義可覆蓋它。
4)invalidMessage:當文字內容無效後彈出該工具提示,系統有預設[英文],自定義可覆蓋它。
5、 ul easyui-tree 生成一個樹形結構。
屬性如下:
1)url:一個獲取遠端資料的地址。
2)animate:當展開或摺疊節點時是否定義動畫效果。true[是] false[否] 預設false
節點屬性如下:
1)text:節點的顯示文字。
2)id:節點ID,對於載入遠端資料時非常重要。
3)state:節點狀態,'open'或'closed',預設為'open'。當設定為'關閉',該節點包含子節點,並將遠端站點載入它們(並非觸發再載入)。
4)attributes:為節點新增自定義屬性。
5)children:以陣列節點的方式定義一些位元組點。
事件如下:
1)onClick:
當用戶點選一個節點時啟用,該節點引數包含如下屬性:
id:節點ID
text:節點文字
attributes:節點自定義屬性。
target:目標點選的DOM物件。
2)onLoadSuccess:
當資料成功載入資料時啟用,該引數跟jQuery.ajax的'success'函式效果相同。
3)onLoadError:
當資料載入資料失敗時啟用,該引數跟jQuery.ajax的'error'函式效果相同。
方法如下:
1)reload:重新載入樹資料。
2)getSelected:獲取選中的節點並返回它,如果沒有選擇節點將返回null。
3)collapse:摺疊一個節點,該目標引數是該節點的DOM物件。
4)expand:展開一個節點,該目標引數是該節點的DOM物件。
5)append:在一個父節點追加一些子節點。
param有兩個屬性:
parent:DOM物件,把它作為父節點追加(它們)。
data:array,或者節點資料。
6)remove:刪除它以及它以下的子節點,該目標引數是該節點的DOM物件。
6、 table easyui-datagrid 生成一個表格。
屬性如下:
1)title:該DataGrid面板的標題文字。
2)iconCls:一個CSS類,將提供一個背景圖片作為標題圖示。
3)border:當true時,顯示該datagrid面板的邊框。
4)width:面板寬度,自動列寬。
5)height:面板高度,自動列高。
6)columns:該DataGrid列配置物件,檢視column屬性可獲取更多資訊。
7)frozenColumns:跟Columns屬性相同,但是這些列將會被固定在左邊。
8)striped:當true時,單元格顯示條紋。預設false。
9)method:通過該方法型別請求遠端資料。預設post。
10)nowrap:當true時,顯示資料在同一行上。預設true。
11)idField:說明哪個欄位是一個標識欄位。
12)url:一個URL,從遠端站點獲取資料。
13)loadMsg:當從遠端站點載入資料時,顯示一個提示資訊。預設"Processing,please wait …"。自定義覆蓋。
14)pagination:當true時在DataGrid底部顯示一個分頁工具欄。預設false。
15)rownumbers:當true時顯示行號。預設false。
16)singleSelect:當true時只允許當前選擇一行。預設false。
17)fit:當true時,設定大小以適應它的父容器。預設false。
18)pageNumber:當設定分頁屬性時,初始化的頁碼編號。預設從1開始
19)pageSize:當設定分頁屬性是,初始化的頁面大小。預設10行
20)pageList:當設定分頁屬性時,初始化頁面的大小選擇清單。預設[10,20,30,40,50]
21)queryParams:當請求遠端資料時,也可以傳送額外的引數。
22)sortName:定義哪列可以排序。
23)sortOrder:定義列的排列順序,只能是'asc'或'desc'。預設asc。
Column屬性如下:
1)title:該列標題文字。
2)field:該列對應的欄位名稱。
3)width:列寬。
4)rowspan:說明該單元格需要多少行數。
5)colspan:說明該單元格需要多少列數。
6)align:說明Column資料的對齊方式。'left','right','center' 都可以使用。
7)sortable:當true時,允許該列進行排序。
8)checkbox:當true時,允許該列出現checkbox。
事件如下:
1)onLoadSuccess:當遠端資料載入成功是啟用。
2)onLoadError:當遠端資料載入發現一些錯誤時啟用。
3)onClickRow:當用戶點選某行時啟用,引數包含:
rowIndex: 點選的行索引,從0開始。
rowData: 點選行時對應的記錄。
4)onDblClickRow:當用戶雙擊某行時啟用,引數包含:
rowIndex: 點選的行索引,從0開始。
rowData: 點選行時對應的記錄。
5)onSortColumn:當用戶對某列排序時啟用,引數包含:
sort:排序欄位名稱。
order:排序欄位型別。
6)onSelect:當用戶選擇某行時啟用,引數包含:
rowIndex: 點選的行索引,從0開始。
rowData: 點選行時對應的記錄。
7)onUnselect:當用戶取消選擇某行時啟用,引數包含:
rowIndex: 點選的行索引,從0開始。
rowData: 點選行時對應的記錄。
方法如下:
1)options:返回選擇物件。
2)resize:重調大小,生成佈局。
3)reload:重新載入資料。
4)fixColumnSize:固定列大小。
5)loadData:載入本地資料,過去的行會被刪除。
6)getSelected:返回第一個選中行的記錄,若未選返回null。
7)getSelections:返回選中的所有行,當沒有選擇記錄時將返回空陣列。
8)clearSelections:清除所有選項的選擇狀態。
9)selectRow:選擇一行,行索引從0開始。
10)selectRecord:通過傳遞一個ID值引數,選擇一行。
11)unselectRow:取消選擇一行。
7、 div easyui-tabs 生成一個tab容器。
屬性如下:
1)width:容器寬度,自動列寬。
2)height:容器高度,自動列高。
3)idSeed:該根id衍生成標籤面板DOM id屬性。預設0
4)plain:當true時,該Tab渲染不使用容器背景圖片。預設false
5)fit:當true時,設定該Tab大小以適應它的父容器。預設false
6)border:當true時,顯示該Tab邊框。
7)scrollIncrement:
8)scrollDuration:
事件如下:
1)onLoad:當一個ajax Tab面板需要載入遠端資料時啟用。該引數跟jQuery.ajax的'success'函式效果相同。
2)onSelect:當用戶選擇一個Tab面板時啟用。
3)onClose:當用戶關閉一個Tab面板時啟用。
方法如下:
1)resize:重繪該Tab容器的佈局。
2)add:新增加一個Tab面板,該選項引數是一個配置物件,看Tab面板屬性可獲取更多資訊。
3)close:關閉該Tab面板,標題引數顯示你要關閉的物件。
4)select:選擇一個Tab面板。
5)exists:如果該Tab面板存在即顯示。
Tab面板屬性如下:
1)id:該Tab面板DOM id屬性。
2)text:該Tab面板標題文字。
3)content:該Tab面板內容。
4)href:一個URL,載入遠端內容以填充Tab面板。
5)cache:當true時,快取Tab面板,當href 屬性設定後有效。預設true
6)icon:增加一個CSS class圖示以顯示在Tab面板的標題旁。
7)closable:當true時,該Tab面板將顯示可關閉按鈕,點選能關閉該Tab面板。預設false
8)selected:當true時,該Tab面板將被選中。預設false
9)width:面板寬度,自動列寬。
10)height:面板高度,自動列高。
8、div menu-sep 生成一個選單分隔線。
屬性如下:
1)required:true[必需] false[不必需] 預設false
2)validType:
a、length[a,b] 欄位長度控制在a至b之間。
b、email 驗證Email。
c、url 驗證網路地址。
3)missingMessage:當文字時出現空時彈出該工具提示,系統有預設[英文],自定義可覆蓋它。
4)invalidMessage:當文字內容無效後彈出該工具提示,系統有預設[英文],自定義可覆蓋它。
5、
屬性如下:
1)url:一個獲取遠端資料的地址。
2)animate:當展開或摺疊節點時是否定義動畫效果。true[是] false[否] 預設false
節點屬性如下:
1)text:節點的顯示文字。
2)id:節點ID,對於載入遠端資料時非常重要。
3)state:節點狀態,'open'或'closed',預設為'open'。當設定為'關閉',該節點包含子節點,並將遠端站點載入它們(並非觸發再載入)。
4)attributes:為節點新增自定義屬性。
5)children:以陣列節點的方式定義一些位元組點。
事件如下:
1)onClick:
當用戶點選一個節點時啟用,該節點引數包含如下屬性:
id:節點ID
text:節點文字
attributes:節點自定義屬性。
target:目標點選的DOM物件。
2)onLoadSuccess:
當資料成功載入資料時啟用,該引數跟jQuery.ajax的'success'函式效果相同。
3)onLoadError:
當資料載入資料失敗時啟用,該引數跟jQuery.ajax的'error'函式效果相同。
方法如下:
1)reload:重新載入樹資料。
2)getSelected:獲取選中的節點並返回它,如果沒有選擇節點將返回null。
3)collapse:摺疊一個節點,該目標引數是該節點的DOM物件。
4)expand:展開一個節點,該目標引數是該節點的DOM物件。
5)append:在一個父節點追加一些子節點。
param有兩個屬性:
parent:DOM物件,把它作為父節點追加(它們)。
data:array,或者節點資料。
6)remove:刪除它以及它以下的子節點,該目標引數是該節點的DOM物件。
6、
屬性如下:
1)title:該DataGrid面板的標題文字。
2)iconCls:一個CSS類,將提供一個背景圖片作為標題圖示。
3)border:當true時,顯示該datagrid面板的邊框。
4)width:面板寬度,自動列寬。
5)height:面板高度,自動列高。
6)columns:該DataGrid列配置物件,檢視column屬性可獲取更多資訊。
7)frozenColumns:跟Columns屬性相同,但是這些列將會被固定在左邊。
8)striped:當true時,單元格顯示條紋。預設false。
9)method:通過該方法型別請求遠端資料。預設post。
10)nowrap:當true時,顯示資料在同一行上。預設true。
11)idField:說明哪個欄位是一個標識欄位。
12)url:一個URL,從遠端站點獲取資料。
13)loadMsg:當從遠端站點載入資料時,顯示一個提示資訊。預設"Processing,please wait …"。自定義覆蓋。
14)pagination:當true時在DataGrid底部顯示一個分頁工具欄。預設false。
15)rownumbers:當true時顯示行號。預設false。
16)singleSelect:當true時只允許當前選擇一行。預設false。
17)fit:當true時,設定大小以適應它的父容器。預設false。
18)pageNumber:當設定分頁屬性時,初始化的頁碼編號。預設從1開始
19)pageSize:當設定分頁屬性是,初始化的頁面大小。預設10行
20)pageList:當設定分頁屬性時,初始化頁面的大小選擇清單。預設[10,20,30,40,50]
21)queryParams:當請求遠端資料時,也可以傳送額外的引數。
22)sortName:定義哪列可以排序。
23)sortOrder:定義列的排列順序,只能是'asc'或'desc'。預設asc。
Column屬性如下:
1)title:該列標題文字。
2)field:該列對應的欄位名稱。
3)width:列寬。
4)rowspan:說明該單元格需要多少行數。
5)colspan:說明該單元格需要多少列數。
6)align:說明Column資料的對齊方式。'left','right','center' 都可以使用。
7)sortable:當true時,允許該列進行排序。
8)checkbox:當true時,允許該列出現checkbox。
事件如下:
1)onLoadSuccess:當遠端資料載入成功是啟用。
2)onLoadError:當遠端資料載入發現一些錯誤時啟用。
3)onClickRow:當用戶點選某行時啟用,引數包含:
rowIndex: 點選的行索引,從0開始。
rowData: 點選行時對應的記錄。
4)onDblClickRow:當用戶雙擊某行時啟用,引數包含:
rowIndex: 點選的行索引,從0開始。
rowData: 點選行時對應的記錄。
5)onSortColumn:當用戶對某列排序時啟用,引數包含:
sort:排序欄位名稱。
order:排序欄位型別。
6)onSelect:當用戶選擇某行時啟用,引數包含:
rowIndex: 點選的行索引,從0開始。
rowData: 點選行時對應的記錄。
7)onUnselect:當用戶取消選擇某行時啟用,引數包含:
rowIndex: 點選的行索引,從0開始。
rowData: 點選行時對應的記錄。
方法如下:
1)options:返回選擇物件。
2)resize:重調大小,生成佈局。
3)reload:重新載入資料。
4)fixColumnSize:固定列大小。
5)loadData:載入本地資料,過去的行會被刪除。
6)getSelected:返回第一個選中行的記錄,若未選返回null。
7)getSelections:返回選中的所有行,當沒有選擇記錄時將返回空陣列。
8)clearSelections:清除所有選項的選擇狀態。
9)selectRow:選擇一行,行索引從0開始。
10)selectRecord:通過傳遞一個ID值引數,選擇一行。
11)unselectRow:取消選擇一行。
7、
屬性如下:
1)width:容器寬度,自動列寬。
2)height:容器高度,自動列高。
3)idSeed:該根id衍生成標籤面板DOM id屬性。預設0
4)plain:當true時,該Tab渲染不使用容器背景圖片。預設false
5)fit:當true時,設定該Tab大小以適應它的父容器。預設false
6)border:當true時,顯示該Tab邊框。
7)scrollIncrement:
8)scrollDuration:
事件如下:
1)onLoad:當一個ajax Tab面板需要載入遠端資料時啟用。該引數跟jQuery.ajax的'success'函式效果相同。
2)onSelect:當用戶選擇一個Tab面板時啟用。
3)onClose:當用戶關閉一個Tab面板時啟用。
方法如下:
1)resize:重繪該Tab容器的佈局。
2)add:新增加一個Tab面板,該選項引數是一個配置物件,看Tab面板屬性可獲取更多資訊。
3)close:關閉該Tab面板,標題引數顯示你要關閉的物件。
4)select:選擇一個Tab面板。
5)exists:如果該Tab面板存在即顯示。
Tab面板屬性如下:
1)id:該Tab面板DOM id屬性。
2)text:該Tab面板標題文字。
3)content:該Tab面板內容。
4)href:一個URL,載入遠端內容以填充Tab面板。
5)cache:當true時,快取Tab面板,當href 屬性設定後有效。預設true
6)icon:增加一個CSS class圖示以顯示在Tab面板的標題旁。
7)closable:當true時,該Tab面板將顯示可關閉按鈕,點選能關閉該Tab面板。預設false
8)selected:當true時,該Tab面板將被選中。預設false
9)width:面板寬度,自動列寬。
10)height:面板高度,自動列高。
8、div menu-sep 生成一個選單分隔線。