jQuery EasyUI從零開始學

第1篇  EasyUI的基礎組件

第1章  jQuery EasyUI快速入門 3

1.1  什么是jQuery EasyUI 3

1.2  jQuery EasyUI的初步使用 4

1.2.1  下載及版本說明 4

1.2.2  直接在HTML中使用 4

1.2.3  使用Javascript創(chuàng)建 4

1.3  搭建本地服務器 5

1.4  實戰(zhàn)：第一個EasyUI注冊頁面 8

1.5  小結 9

第2章  EasyUI表單 10

2.1  文本框簡介 10

2.1.1  驗證框（ValidateBox） 11

2.1.2  文本框（TextBox） 17

2.1.3  密碼框（PasswordBox） 26

2.1.4  數字框（NumberBox） 27

2.2  組合簡介 33

2.2.1  組合（Combo） 33

2.2.2  組合框（ComboBox） 37

2.3  微調器簡介 46

2.3.1  微調器（Spinner） 46

2.3.2  數字微調器（NumberSpinner） 48

2.3.3  時間微調器（TimeSpinner） 49

2.3.4  日期微調器（DateTimeSpinner） 50

2.4  菜單和按鈕 51

2.4.1  菜單（Menu） 51

2.4.2  鏈接按鈕（LinkButton） 56

2.4.3  菜單按鈕（MenuButton） 59

2.4.4  分割按鈕（SplitButton） 61

2.4.5  切換按鈕（SwitchButton） 63

2.5  快速輸入日期 64

2.5.1  日歷（Calendar） 65

2.5.2  日期框（DateBox） 68

2.5.3  日期時間框（DateTimeBox） 76

2.6  其他高級組件 77

2.6.1  標簽框（TagBox） 77

2.6.2  搜索框（SearchBox） 78

2.6.3  文件框（FileBox） 80

2.7  表單 83

2.7.1  表單的基本使用方法 83

2.7.2  提交表單 85

2.7.3  初始化表單字段 86

2.7.4  文件上傳 88

2.8  小結 89

第3章  拖  放 90

3.1  DOM與事件對象 90

3.1.1   DOM 90

3.1.2   事件對象 92

3.2  拖放（Draggable） 93

3.2.1  拖放的使用方法 93

3.2.2  容器內拖放 97

3.2.3  快速拖放 98

3.3  放置（Droppable） 99

3.3.1  放置的使用方法 99

3.3.2  授權拖放的組件 100

3.4  縮放（Resizable） 102

3.5  實戰(zhàn)：購物車的拖放 103

3.6  小結 105

第4章  常用組件 106

4.1  提示框（Tooltip） 106

4.1.1  創(chuàng)建提示框 106

4.1.2  提示框可綁定的元素 108

4.1.3  提示框的內容 110

4.2  進度條（ProgressBar） 111

4.3  滑塊（Slider） 112

4.4  實戰(zhàn)：向服務器提交滑塊數據 115

4.5  小結 116

第5章  窗口與布局 117

5.1   面板 117

5.1.1  基礎面板（Panel） 117

5.1.2  折疊面板（Accordion） 128

5.1.3  選項卡（Tabs） 134

5.2  布局（Layout） 139

5.2.1  簡單的布局 140

5.2.2  添加和刪除布局 143

5.2.3  布局的種類 144

5.2.4  嵌套布局 146

5.2.5  自適應高度布局 147

5.2.6  復雜布局 148

5.3  窗口（Window） 151

5.3.1  創(chuàng)建簡單的窗口 151

5.3.2  創(chuàng)建模態(tài)窗口 153

5.3.3  創(chuàng)建內聯窗口 153

5.3.4  窗口的布局 154

5.3.5  窗口的頁腳 155

5.3.6  窗口的邊框樣式 156

5.4  對話框（Dialog） 157

5.5  信息提示窗口（Messager） 159

5.5.1  底部提示窗口 159

5.5.2  消息提示窗口 160

5.5.3  確認提示窗口 161

5.5.4  進度提示窗口 162

5.5.5  輸入提示窗口 162

5.6  小結 163

第6章  深入理解EasyUI組件機制 164

6.1  使用EasyUI開發(fā)自定義組件 165

6.2  插件的制作方法 171

6.2.1  使用jQuery制作插件 172

6.2.2  $.extend方法 173

6.2.3  $.data方法 174

6.3  EasyUI插件源碼分析 174

6.3.1  默認配置和選項對象 174

6.3.2  EasyUI屬性設置 176

6.3.3  默認方法 179

6.3.4  其他源碼分析 180

6.3.5  總結 181

6.4  制作起止日期框插件 182

6.5  在標記中定義組件 186

6.6  起止日期框使用文檔 187

6.7  小結 190

第2篇  EasyUI數據的獲取和展示

第7章  數據的獲取與展示 193

7.1  使用表單向服務器提交數據 193

7.2  數據網格（DataGrid） 194

7.2.1  使用本地數據初始化數據網格 195

7.2.2  使用服務器端數據初始化數據網格 196

7.2.3  數據網格中的列 198

7.2.4  數據網格中的行 210

7.2.5  創(chuàng)建工具欄 214

7.2.6  數據網格事件和方法 215

7.2.7  數據網格編輯 221

7.2.8  數據網格視圖 228

7.3  分頁器（Pagination） 229

7.3.1  分頁器概述 229

7.3.2  數據網格中的分頁 233

7.4  數據列表（DataList） 236

7.5  屬性網格（PropertyGrid） 239

7.6  組合網格（ComboGrid） 241

7.7  樹（Tree） 244

7.7.1  樹形結構簡介 244

7.7.2  EasyUI中樹的使用方法 245

7.7.3  可編輯的樹 256

7.7.4  動態(tài)操作樹 256

7.8  樹形網格（TreeGrid） 257

7.8.1  樹形網格的基本使用方法 258

7.8.2  復雜的樹形網格 263

7.9  組合樹（ComboTree） 265

7.10  組合樹形網格 266

7.11  小結 268

第8章  CRUD 應用 269

8.1  了解什么是CRUD 269

8.2  創(chuàng)建簡單的CRUD應用 270

8.2.1  查詢數據（Retrieve） 270

8.2.2  增加數據（Create） 271

8.2.3  更新數據（Update） 272

8.2.4  刪除數據（Delete） 273

8.2.5  提交表單 274

8.2.6  服務器代碼簡介 275

8.3  創(chuàng)建CRUD數據網格 276

8.3.1  獲取數據 276

8.3.2  新增數據 277

8.3.3  更新數據 278

8.3.4  刪除數據 278

8.4  自動增加網格行數據 279

8.4.1  讀取數據 279

8.4.2  編輯數據 280

8.4.3  創(chuàng)建數據 282

8.4.4  刪除數據 283

8.5  小結 284

第3篇  EasyUI高級應用

第9章  開發(fā)移動頁面 287

9.1  移動端基礎 287

9.1.1  自適應屏幕寬度 287

9.1.2  移動端調試方法 288

9.1.3  EasyUI開發(fā)移動頁面基礎 289

9.2  表單 290

9.2.1  輸入框 290

9.2.2  按鈕 291

9.2.3  開發(fā)移動端登錄頁面 292

9.3  移動端頁面布局 293

9.3.1  工具欄 293

9.3.2  面板 294

9.3.3  選項卡 295

9.3.4  折疊面板 297

9.3.5  布局 297

9.3.6  菜單 298

9.3.7  樹 299

9.4  對話框 300

9.5  信息提示 300

9.6  動畫 301

9.7  數據展示 301

9.7.1  簡單的列表（SimpleList） 301

9.7.2  數據列表（DataList） 302

9.7.3  數據網格（Datagrid） 303

9.8  小結 304

第10章   jQuery EasyUI的主題 305

10.1  更改主題樣式 305

10.2  替換本機主題樣式 306

10.3  保存主題樣式 307

10.3.1  在服務器上保存 307

10.3.2  本地保存 307

10.4  圖標的更改 308

10.5  小結 308

第11章   jQuery EasyUI的擴展 309

11.1  數據網格視圖 309

11.1.1  數據網格詳細內容視圖（DataGrid DetailView） 309

11.1.2  數據網格分組視圖（DataGrid GroupView） 312

11.1.3  數據網格緩存視圖（DataGrid BufferView） 314

11.1.4  虛擬滾動視圖（VirtualScrollView） 315

11.1.5  自定義數據網格視圖 318

11.2  可編輯的數據網格（Editable DataGrid） 320

11.3  可編輯樹（Editable Tree） 322

11.4  數據網格單元格編輯（Cell Editing in DataGrid） 325

11.5  數據網格拖曳與放置（Drag and Drop Rows in DataGrid） 327

11.6  樹形網格行的拖曳與放置（Drag and Drop Rows in TreeGrid） 328

11.7  列的擴展（Columns Extension） 329

11.8  數據網格的過濾（DataGrid Filter Row） 331

11.9  數據分析器（PivotGrid） 339

11.10  DWR加速 342

11.11  RTL的支持 343

11.12  Ribbon——Office功能區(qū)界面 344

11.13  文本編輯器（TextEditor） 345

11.14  小結 347

第12章  設計一個實戰(zhàn)項目 348

12.1  登錄驗證設計 348

12.1.1  如何確認身份 349

12.1.2  如何驗證身份 350

12.1.3  登錄頁面的設計 351

12.1.4  登錄驗證系統(tǒng)設計方案 354

12.2  加密與解密技術 355

12.2.1  對稱加密 355

12.2.2  非對稱加密 356

12.2.3  不可逆加密 356

12.3  EasyUI界面框架 356

12.4  小結 358