sg uap v2 8高級(jí)開發(fā)手冊(cè)分冊(cè)2客戶端

REST1.3.4多層 樹表組件數(shù)據(jù)表格組件數(shù)據(jù)表單復(fù)合表單鎖定列表格多表頭表格樹樹節(jié)點(diǎn)消息提示框提示窗口復(fù)選框 下拉表格上傳控件向?qū)Чぞ?.141.1添加章節(jié):.15添加章節(jié):.16添加章節(jié):1.3.4AOPSG-UAP業(yè)務(wù)系統(tǒng)之前端 MX展現(xiàn)框架概 概 展現(xiàn)框架配 與服務(wù)端業(yè)務(wù)模型的關(guān) 數(shù)據(jù)控件和服務(wù)端的交互數(shù)據(jù)規(guī) MX展現(xiàn)框架開 JavaScript語(yǔ)言擴(kuò) 概 語(yǔ)言擴(kuò)展的組 語(yǔ)言擴(kuò)展的構(gòu) 語(yǔ)言擴(kuò)展的運(yùn)行機(jī) 語(yǔ)言擴(kuò)展的開發(fā)及應(yīng) 命名空 24繼 反 JavaScript運(yùn)行時(shí)擴(kuò) 概 運(yùn)行時(shí)擴(kuò)展的組 運(yùn)行時(shí)擴(kuò)展的構(gòu) 文 運(yùn)行時(shí)擴(kuò)展的運(yùn)行機(jī) 運(yùn)行時(shí)擴(kuò)展的開發(fā)及應(yīng)用（類圖 Boolean Number Date String Array MX基礎(chǔ)類擴(kuò) MX基礎(chǔ)類概 MX基礎(chǔ)類擴(kuò)展的組 MX基礎(chǔ)類擴(kuò)展的構(gòu) MX基礎(chǔ)類擴(kuò)展的運(yùn)行機(jī) MX基礎(chǔ)類擴(kuò)展的開發(fā)及應(yīng)用（類圖 MX MXObject MXEvent ponent MX 的構(gòu) .2文 運(yùn)行機(jī) 開發(fā)及應(yīng) 資源管 國(guó)際語(yǔ)言切 MX樣式樣式的構(gòu) 樣式的運(yùn)行機(jī) 樣式開發(fā)及應(yīng) 基礎(chǔ)控 MX組 Weblet、加載、運(yùn) 概 Weblet使用方 Weblet類 基礎(chǔ)組 日期選擇 工具菜單 菜單項(xiàng) 右鍵菜單(Context 錯(cuò)誤提示器 進(jìn)度條 多進(jìn)度滑動(dòng)選擇控件 樹形列表 Excel導(dǎo)入向?qū)?哈希表對(duì)象 視圖容器 視圖控制器 抽象類 多進(jìn)度滑動(dòng)選擇控件 數(shù)據(jù)展現(xiàn)組 復(fù)合表格 表單 表單 復(fù)合表單 動(dòng)態(tài)表單 表格 表格中的列 表格查詢框 單字段 多表頭表格 行分組表格 固定列表格 分組固定表格 滾動(dòng)加載數(shù)據(jù)表格 合并數(shù)據(jù)表格 窗口控 窗口控 數(shù)據(jù)實(shí)體容 數(shù)據(jù)容器 表單數(shù)據(jù)容器 表格數(shù)據(jù)容器 樹形數(shù)據(jù)容器 數(shù)據(jù)容器綁定工具 *數(shù)據(jù)容器參數(shù) 編輯器組 編輯器抽象類 復(fù)選框 組合單選/復(fù)選 多選/單選項(xiàng)列表的數(shù)據(jù)項(xiàng) 下拉列表抽象類 自定義文本編輯器 下拉日期選擇 可編輯下拉列表 編輯器工廠類 編輯器 列表編輯器 列表編輯器數(shù)據(jù)項(xiàng) 數(shù)字編輯器 編輯器 富文本編輯器 文本編輯器 時(shí)間編輯器 數(shù)字和時(shí)間編輯器抽象類 文件上傳編輯器 下拉樹編輯器 智能查詢編輯器 下拉表格編輯器 Slide編輯器控件 容器組 選項(xiàng)卡 選項(xiàng)頁(yè)面 分割組件 水平分割組件 垂直分割組件 手風(fēng)琴容器控件 工具箱控件 工具箱控件 頁(yè)面容器控件 面板容器 多面板布局 向?qū)Чぞ吖δ?操作步驟功能 面板容器控件 REST服務(wù)客戶 REST服務(wù)客戶端（REST 通用工具 驗(yàn)證字符串 剪切簿 加密字符串 GUID字符串 Json工具 對(duì)象池 圖標(biāo)工具 Excel工具 JQuery的擴(kuò)展插 概 使用方 數(shù)據(jù)與圖 概 使用方 權(quán)限集 概 使用方 方 MX展現(xiàn)框架高級(jí)特 調(diào)用其他 自定義皮 自定義皮膚的使 自定義皮膚自定義控 創(chuàng)建自定義控 自定義控件的使 多 結(jié) SG-UAPMXSG-UAP運(yùn)用Weblet技術(shù)，巧妙的整合數(shù)據(jù)與前端html、css、Jquery1.7.2，swfObject.js層、Weblet基礎(chǔ)層包括JavaScript語(yǔ)言擴(kuò)展、JavaScript運(yùn)行時(shí)擴(kuò)展、以及主REST、Weblet小程序是web應(yīng)用的最小邏輯單元，它將頁(yè)面文件文件和資源 、MXweb全局配置文件：UAP項(xiàng)目下的WEB-INF/#前端展現(xiàn)框架是否使用調(diào)試模式，默認(rèn)為true，生產(chǎn)環(huán)境下建議設(shè)置為#前端展現(xiàn)框架是否使好模式（不顯示具體報(bào)錯(cuò)信息）處理報(bào)錯(cuò)，支持#建議生產(chǎn)模式下調(diào)成console當(dāng)設(shè) PRESSMODE=true時(shí)，需要同時(shí)在應(yīng)用配置文“perties”中添加URL匹配方式配置“**/mx/servlets/mxframework，避免被統(tǒng)一權(quán)限過(guò)濾器后無(wú)法。臺(tái)(uds)#默認(rèn)為file，代表采用磁盤方#前端展現(xiàn)框架上傳模式配置為file時(shí)，需要設(shè)置全局上 的根路徑#如果不設(shè)置或者設(shè)置為null，則默認(rèn)在用戶 下創(chuàng)建mxuploadpath目#前端展現(xiàn)框架的全局，默認(rèn)提供三種配置#1、采用類WIN7(aero)，2、采用灰色(default)，3、為了兼的擴(kuò)展模塊中實(shí)現(xiàn)IE67的擴(kuò)展，定制項(xiàng)目所需風(fēng)格的IE67。默認(rèn)的IE67的風(fēng)格是和aero保持一致的。#默認(rèn)為aero#非IE67瀏覽器使用aero，IE6、7瀏覽器使用ie67。配置如UAPMX.mappathAPIAPP_SERVER_ENCODING=ISO8859-#前端展現(xiàn)框架設(shè)置是否在Weblet中使用支持，默認(rèn)支Jsp頁(yè)面中的文件配//表示在當(dāng)前Weblet使用調(diào)試模式，aero，壓縮模式 me.form=newmx.d fields: name:"fileAttrFile",caption:"", type:"form",uploadMode:}圖表：WebletUAP如上圖所示：testpt是一個(gè)UAP模塊，face 下的complextable、many2many、proj等是Weblet，在發(fā)布模塊時(shí)，scripts 下生成壓縮的webletname.weblet.js，在開發(fā)模式下使用具體的js，例如：MainView.js等“MX_DEBUGMODE=alse）webletname.weblet.js，減少網(wǎng)絡(luò)流量，加快速度注意：在項(xiàng)目上線前需要確保使用生產(chǎn)模式可以正常項(xiàng)目WebletWeblet用戶頁(yè)面文件通過(guò)index.jsp里的<mx:WebletContainerid="webletContainer"webletID="attrtest"bundleName="exam"></mx:WebletContainer>找到對(duì)應(yīng)的 id:"attrtest",name:"屬性測(cè)試 id:"attrtest",name:"屬性測(cè)試", onstart:{varmvc=newattrtest.views.MainViewController();}MainView.jsDetailView.jsrest皮膚，樣式以及等資源文件可在MainView.js或中21.1.6。baseUrlRESTbaseUrlurl:baseUrl+”/meta”url:baseUrl+”/save”url:新增不會(huì)產(chǎn)生服務(wù)請(qǐng)求，展現(xiàn)框架的新增是數(shù)據(jù)實(shí)體容器根據(jù)元數(shù)據(jù)的定urlJSON定義路徑，瀏覽器會(huì)彈出該頁(yè)面，頁(yè)面中需要定義“<divid='btnClose'/></div>{"successful":true,"resultValue":司"},{"value":"1","text":"yy注：items表示服務(wù)端返回的數(shù)據(jù)實(shí)體對(duì)象集合，itemCountdicts獲取企業(yè)部門指~/modulepathrest/department/meta(meta為組件自動(dòng)添加定列的元數(shù)據(jù)信息{nullable:false,必須)dataType:”string必須)(name:”bmmscaption:”部門描述”,……},//name:”sjbmcaption:”上級(jí)部門”,……}//]獲取企業(yè)部門列~/modulepathfilter：””,（）//sorter：”MCASCBIRTHDESC”（）//pageIndex：””,（可選）//pageSize：””,（可選）//columnsbmmc,bmms,sjbm”//itemCount:100必須){bmbh:”xxxxxxxxxxxxxxx”,},//{xxxx},//]獲取單個(gè)企業(yè)部~/modulepathrest/departmentbmbh}(bmbh加{columns:[“bmbh,bmmc,}{{bmbh:”xxxxxxxxxxxxxxx”,}]}保存企業(yè)部門信~/modulepathrest/departmentsave(save通過(guò)組件自動(dòng)添加{{bmbh:”xxxxxxxxxxxxxxx”,bmmc:”電力公司”,},//{xxxx},//]}bmbh為空值，執(zhí)行新增操作，否則執(zhí)行更新操作。參數(shù)需要在中執(zhí)行JSON.stringify（）進(jìn)行轉(zhuǎn)換處理。{bmbh:”xxxxxxxxxxxxxxx”,bmmc:”電力公司”,},//{xxxx},//刪除企業(yè)部門信~/modulepathrest/department (delete通過(guò)組件自動(dòng)添加{ //}說(shuō)明：參數(shù)需要在中執(zhí)行JSON.stringify（）進(jìn)行轉(zhuǎn)換處理以企業(yè)部門的數(shù)據(jù)操作為例，數(shù)據(jù)樹（DataTree）獲取第一層企業(yè)~/modulepath[{text:”江蘇省電力公司必須)}]獲取企業(yè)部門子~/modulepath[{”,({]獲取單個(gè)企業(yè)部~/modulepath/rest/department/tree/{id}{text:”江蘇省電力公司必須)}刪除企業(yè)部門信~/modulepathrest/department (delete通過(guò)組件自動(dòng)添加息{ //}說(shuō)明：參數(shù)需要在中執(zhí)行JSON.stringify（）進(jìn)行轉(zhuǎn)換處理以企業(yè)部門的數(shù)據(jù)操作為例，樹形視圖（TreeListView）獲取第一層企業(yè)~/modulepath獲取企業(yè)部門子~/modulepath 獲取編輯器下拉框的輸入匹配數(shù){term: limit":{resultValue:[{text:'中國(guó)',value: '},{text:'智利',value:resultHint:"",successful:JavaScriptJavaScript增加了類命名空間繼承以及反射等面向?qū)ο蟮奶匦杂欣贘avaScriptJavaScript類js為方便對(duì)類文件的管理，為js類賦予層級(jí)結(jié)構(gòu)名空間特性，命名方式j(luò)ava結(jié)構(gòu)相對(duì)應(yīng)，層級(jí)之間用點(diǎn)號(hào)“.”分割?？蚣芴峁┟臻g方法為$ns(“module.package”);參考java語(yǔ)言類的方式，通過(guò)調(diào)用指定方法，在本類中加載指定類的代碼。二次開發(fā)代碼中的重復(fù)加載平臺(tái)會(huì)自動(dòng)忽略?？蚣芴峁┑念惙椒愔g的只在開發(fā)階段發(fā)揮作用，運(yùn)行時(shí)在初次加載Weblet時(shí)即將所function，使得類被繼承的時(shí)候即動(dòng)態(tài)執(zhí)行其內(nèi)部在繼承生效時(shí)，將對(duì)應(yīng)信息記錄到這些變量中。然后MXObject提供getClass方法，返回當(dāng)前從以上變量中對(duì)象的類型信息。mx/scripts/types中查看這些jsJavaScriptJavaScriptvarvaryesterday=today.addDays(-varvaryesterday=today.addDays(-varvar無(wú)無(wú)無(wú)無(wú)該方法有一個(gè)參數(shù)p_textp_text是需要轉(zhuǎn)換的值。無(wú)無(wú)無(wú)無(wú)JavaScriptDate無(wú)無(wú)無(wú)無(wú)p_textDate，該方法有兩個(gè)參數(shù)p_year，p_month該方法有一個(gè)參數(shù)p_minutes。p_minutesJavaScriptString無(wú)無(wú)無(wú)無(wú)該方法有一個(gè)參數(shù)p_subString。p_subString串。該方法在字符串中查找是否含有p_subString。有返回?zé)o無(wú)無(wú)無(wú)1該方法有一個(gè)參數(shù)p_item。p_item為指定的項(xiàng)。該方法將p_item該方法有兩個(gè)參數(shù)p_item，p_beforeItem。該方法將p_afterItem信息輸出功能、模型以及組件功能等MXMX、、ponentMX。MXObject框架所有類的頂層基類，MXEvent類是類，peonent是組件類，MX類無(wú)無(wú)無(wú)無(wú)初始化運(yùn)行環(huán)境，設(shè)置語(yǔ)種，加載基本類庫(kù)和樣式文加載文style根據(jù)信息的Key返回信返回錯(cuò)誤信無(wú)無(wú)無(wú)以數(shù)組形式類的派生路框架提供的基無(wú)無(wú)無(wú)無(wú)以數(shù)組形式存放的信無(wú)無(wú)無(wú)綁定解除綁判斷某種是否已綁觸發(fā)MX 圖表4構(gòu)成 messages.js，該文件中以JSON格式存放了Weblet中所有的信息運(yùn)行機(jī) 該文件中以JSON格式存放了Weblet中所有 信息。使用時(shí)可以mx.msg(key,p_args)方法即可獲取對(duì)應(yīng)的信息另外框架中有一個(gè)全局的變量mx.locale，記錄了框架當(dāng)前使用的配置。默認(rèn)為“。如果需要更換配置，需要在MX類初始化前更改locale的值。開發(fā)及應(yīng)實(shí)現(xiàn)相關(guān)的資源文件統(tǒng)一管理1：2：提供相關(guān)的資源文件在運(yùn)行態(tài)時(shí)的添加和修改的功能接口樣式的構(gòu)圖表5MX樣式構(gòu)成resources/themes下提供若干套平行的皮膚樣式庫(kù)，每個(gè)皮膚樣式CSS結(jié)構(gòu)是相同并且一一對(duì)應(yīng)的。頁(yè)面在加載皮膚樣式庫(kù)時(shí)，位于themes之后的一層名稱是動(dòng)態(tài)的，可以接收代碼返回的名稱，拼接到CSS“mx,視圖范圍之內(nèi)，不會(huì)與頁(yè)面相互影響路徑中“***”綠顏色字體表示：在目前css樣式中沒(méi)有，但是我們可以自定義的屬背景 JSCSS1.mxinput[type=button],.mxinput[type=submit],.mxbutton,.mx.button{:border-radius3px//-moz-border-radius3px//-webkit-border-radius3px//按紐圓角padding-left:15px//按紐左邊距padding-right:15px//按紐右邊距url(images/button_bg.png)repeat-xcentercenter按紐背景及按紐背景的位置 //按紐寬可接受“px%”height: //按紐高可接受“px%”}hoverJSCSS.mxinput[type=button]:hover,.mx.mxbutton:hover,.mx{border:1pxsolid#9D9D9D;//修改按紐的邊框background-imageurl(images/button_hover.png);:::}activeCssCSS***/images/.mxinput[type=button]:active,.mxinput[type=submit]:active,.mxbutton:active,.mx{border:1pxsolid#979797;}HoverCssCSS***/.mx.calendar#naviRowa#prevMonthButton,.mx.calendar#naviRow{}}CssCSS.mx.calendar>table,.mx.calendar>{border:1pxsolid#AAAAAA;//}CssCSS.mx.calendar#naviRowtd,.mx.calendar#naviRow{CssCSS.mx.calendar#naviRow,.mx.calendar{ }CssCSS.mx.calendar#weekRow,.mx.calendar{}CssCSS.mx.calendar#weekRowtd,.mx.calendar#weekRow{ text-shadow:01px1px}CssCSS.mx.calendar.dayRowtd,.mx.calendar.dayRow{color:#424242;//字體顏色}CssCssCSS.mx.calendar.dayRowtd.selected,.mx.calendar.dayRow{border:1pxsolid#8DB2E3;//}CssCSS {}CssCSS{border:1pxsolid }HoverCssCSS{background-color:#DDECFE;//}主菜單(active下拉菜單樣active下拉菜單樣hoverdisabled activeCssCSS***/***/images/main_.mx.main>li.droppedDown>a,.mx.main>li:active>a,.mx.main>li.droppedDown>a,.mx.main>li>a:active{border:1pxsolid#585859;//activebackground-image:url(images/main__pressed_bg.png);//active時(shí)的背景片;//font-wight:boldactive}CssCSS***/***/.,.ul,{;//box-shadow:2px2px2pxrgba(0,0,0,0.4-moz-box-shadow:2px2px2pxrgba(0,0,0,0.4-webkit-box-shadow:2px2px2pxrgba(0,0,0,0.4);//;//}CssCSS***/***/images/.{{_separator_bg.png)repeat-y;//}hoverCssCSS***/***/.mx.main>li:hover>{border:1pxsolid#B6BCCC;//background-image:url(images/main__hover_bg.png);//背景;//font-wight:boldactive}disabledCssCssCSS***/***/235.mx.mainli.disabled>{;//font-wight:boldactive}.mx.main>li.disabled:hover>{//hoverborder:1pxsolidtransparent;//邊框}CssCSS***/***/lia.mx.main>{disy:inline-white-space:position:vertical-align:height:line-height:}.mx.main>li>{disy:inline-cursor:height:line-height:border:1pxsolidposition:top:-top:}CssCSS***/***/.mx.main>li>{disy:inline-block;cursor:pointer;height:20px;line-height:border:1pxsolid position:relative;top:-1px;}HoverCssCSS***/images/1.mx.mx{border:1pxsolid#dfdfdf;//邊框border-bottom:1pxsolid#B6BCCC;border-radius:4px4px0px0px;//邊框陰影;//;//}CssCSS***/images/.mx.toolBar>{ }CssCSS***/images/.mx.toolBar>{ }CssCSS.mx.toolBar>li>a>span#img{disy:inline-block;position:relative;width:16px;//設(shè)置的}CssCSS***/***/.li>a>{background:no-repeatcenter}CssCSS***/.mx.toolBar>li>a>{top:top:-}CssCSS***/此背景邊框繼承自meu.css，如果修改.css會(huì)影響.,.ul,{border:solid1px#979797;// box-shadow:2px2px2pxrgba(0,0,0,0.4-moz-box-shadow:2px2px2pxrgba(0,0,0,0.4-webkit-box-shadow:2px2px2pxrgba(0,0,0,0.4);//}CssCSS***/***/.{片border:1pxsolid }CssCSS***/***/.li>a>{}HoverCssCSS***/.mx.toolBar>li:hover>{box-shadow:inset003pxECF5F8-moz-box-shadow:inset003pxECF5F8;-webkit-box-shadow:inset003px#ECF5F8; border:1pxsolid#c7c2c2;//邊框);//}hoverCssCSS***/***/..{border:solid1px#AECFF7;border-radius:3px;-moz-border-radius:3px;}CssCSS***/.mx{ }CssCSS***/.gressBar>{centerleft;//背景}CssCSS***/.gressBar>{}hoverCssCSS***/.mx.toolBar>li>{ border:1pxsolidtransparent;//邊框border-radius:3px;//圓角;//;//}hoverCssCSS***/.mx.toolBar>li:hover>{box-shadow:inset003pxECF5F8-moz-box-shadow:inset003pxECF5F8-webkit-box-shadow:inset003pxECF5F8;陰影border:1pxsolid#c7c2c2;//邊框;//}CssCSS***/1.mx{border:1pxsolid#dfdfdf;//邊框border-bottom:1pxsolidB6BCCC;border-radius:4px4px0px0px;//圓角-moz-border-radius:4px4px0px0px-webkit-border-radius:4px4px0px0px}CssCSS***/.mx.toolBar>{background:url(images/tool_bar_startFlag.png)centercenterno-repeat;//片}}CssCSS***/.mx {position:absolute;background:url(images/data_grid_head_bg.png)repeat-xcenter背景border-top:1pxsolid#C5C5C5;//上邊框border-bottom1pxsolidC5C5C5;//overflow:}CssCSS***/ .mx.dataGrid#bodytable>tbody>tr>{}.mx.dataGrid#bodytable>tbody>{border-radius:4px4px4px4px;// }.mx #bodytable>tbody>{border-radius:4px4px4px4px;// }}CssCSS***/見進(jìn)度條 中的說(shuō)明7WebletWeblet是一個(gè)由一系列javascript文件、html文件、jsp文件以及資源文件組 圖表：Webletscripts和Weblet運(yùn)行程序。Weblet庫(kù)通常是Weblet志。值得注意的是，MXWebletWebletWeblet此前是否已加載過(guò)，如果沒(méi)有則會(huì)以AJAX方式動(dòng)態(tài)載入，通過(guò)分析完成后，觸發(fā)Weblet.onstart，就可以啟動(dòng)Weblet應(yīng)用程序了。例一個(gè)場(chǎng)景名稱為customerDetail，具體內(nèi)容見下圖index.jspWeblet.js}index.jspwebletIDwebletname當(dāng)前場(chǎng)景其他場(chǎng)景，以逗號(hào)分隔如需本模塊內(nèi)其他的場(chǎng)景，將其他場(chǎng)景weblet的id值寫入如需其他模塊的場(chǎng)景，則通過(guò)“模塊名/webletId”的格式用，，該類是Weblet的元數(shù)據(jù)類了Weblet的唯一標(biāo)識(shí)名稱無(wú)無(wú)無(wú)WebletWebletWebletWebletContextWebletWeblet關(guān)鍵說(shuō)明如果p_url以”./”開頭表示獲取當(dāng)前Weblet的 地址的 地址Weblet的resources/locales Weblet的resources/themes 返回一個(gè)字符串，表示錯(cuò)誤類的信息在控制臺(tái)打印Weblet的錯(cuò)誤日志。日志以在控制臺(tái)打印Weblet的普通日志。日志以Weblet的唯一標(biāo)識(shí)加方括號(hào)開頭（“[dbm]loaded.返回一個(gè)字符串，表示信息在控制臺(tái)打印Weblet的警告日志。日志以WebletWeblet無(wú)無(wú)無(wú)WindowManager無(wú)無(wú)無(wú)Webletbundle的p_WebletIDWeblet，成加載后將觸發(fā)onloadWeblet，Webletonstart無(wú)無(wú)無(wú)無(wú)無(wú)無(wú)無(wú)WebletContainer在實(shí)例化后自動(dòng)初始化，在初始化過(guò)程中自動(dòng)調(diào)用loadloadvarwebletContainer=newvarcalendar=newmx.controls.Calendar();varcalendar=newmx.controls.Calendar({ 抽象類。為菜單、等控件提供基類。該類的派生類包含 HTML<UL>ToolStrip有Main和Context兩個(gè)派生類 varmain =newmx.controls.Main varmain =newmx.controls.Main {}Context提供一個(gè)上下文菜單的類，該上下文菜單使控件能夠公開特定Context的使用方法如下varcontext =newmx.controls.Context 的抽象基類。該類的派生類包括Item等。Item提供一個(gè)在Context和Main控件中顯示的菜單項(xiàng)的類ToolStripitemsContext使用方Context使用方法在ToolStrip中已經(jīng)說(shuō)明varerrorMsg="Line23,objisundefined";//錯(cuò)誤信息為字符串varerror=newError("Line23,objisundefined")error或者使用weblet varProgressBarvarprogressBar=newmx.controls.ProgressBar({width:300});*varprogressBar=newvarprogressBar=newmx.controls.ProgressBar({width:300});{}varslider=newmx.controls.Slideshow({direction:varbutton=newmx.controls.Button({text:"show",onclick:function(){}vartreeList=function{if(p_page.controls.lengthvartreeList=function{if(p_page.controls.length<{treeList=newmx.controls.TreeListView({type:"local",[{name:"folder",value:"folder"{name:"role",value:"role" {name:appendRoot",text:name:append",text:name:remove",text:onitemclick:[name:"name",text:name:"valuetext:[{name:"Folder1",value:"folder1",itemType:"folder",[{name:value:"a1",itemType:"role"}]{name:"Folder2",value:"folder2",itemType:"folder",expanded:true,[{name:"Folder2-1",value:"folder2-1",itemType:"folder",expanded:true,[{name:value:"b1",itemType:"role"{name:value:"b2",itemType:"role"}]}]}onitemdoubleclick:}}function{alert(}function{if(=={name:"root",value:"根節(jié)點(diǎn)",itemType:"folder"}}ExcelWindowManagervardatagridme.getDataGrid()vardatagridme.getDataGrid()獲得datagridvarwindowManageruser.getContext().windowManager;//獲取_importExcelWizard ontrols.wizards.ImportExcelWizard,{varurl=null;if(url!=null){_importExcelWizard.importExcelUrlurl;//服務(wù)端處理Excel}varcallback=function(){};if(callback!=null){_importExcelWizard.finishCallback=}varcolumns=for(vari=0;i<datagrid.columns.length;{if(datagrid.columns[i].name!={columns.add({}}returnhashMapvarhashMap=newhashMapvarhashMap=newvarbutton=newmx.controls.Button({hashMapvarhashMapMVCviewContainer抽象類。提供一個(gè)容器，包含有視圖與視圖控制器。該類的派生類有WebletContainer,WindowSlidevarSlider=newmx.controls.Slider({showProcessTips:true,width:labelCaption:"labelCaption:",labelWidth:120,increment:minValue:maxValue:sliderValues:HttpFTP方式（以文ftp賬號(hào)等信息需在平臺(tái)perties中進(jìn)行配置添加鍵值對(duì)："MX_FTP_SECURITY=主機(jī);端口;用戶名;"，時(shí)用戶名、可以為空，varvarannex=new{filePath:"\\test",windowHeight:"400",width:baseUrl:提供一個(gè)集成和表格的復(fù)合組件ComplexGrid*ComplexGridvargridEntityContainer=newmx.d baseUrl:user.mappath("~/rest/mxuser/"),//user為webletidiscID1iscID是數(shù)據(jù)元素的統(tǒng)一權(quán)限功能編碼。默認(rèn)值為"-1，primaryKey:_dataGrid=new {name:"userid",caption:"用戶編號(hào)",editorType"TextEditor"{name:"username",caption:"用戶名",editorType"TextEditor"{name"departmentid",caption:"部門",editorType:"DropDownEditor",{name: caption:"郵箱",editorType"TextEditor"}//構(gòu)造列排序條件，如果有多列，則以逗號(hào)分隔。例sorter:"schoolASC,classDESC" yCheckBox:true, allowEditing:false,//列表默認(rèn)不可編輯pageSize:20,entityContainer:create:me.controller._btnNew_onclick,//新建按鈕removeme.controller._btnDelete_onclick//刪除按鈕formvar{{}var var_form=newmx.d ,[,,varDataForm=newmx.d printHideFields:false,fields:{name:caption:" editorType:'TextEditor',value:"111"{name:"name10",caption:" editorType:'TextEditor',textMode:"multiline",value:"222"}entityContainer:newmx.d type:"local"保存、刷新按鈕?？梢酝ㄟ^(guò)disyToolBar屬性控制是否顯示，通過(guò)toolBar屬性新增或刪除已有的按鈕。1JSON2JSONvarentityContainer= ontainers.FormEntityContainer({type:"local"}varform=newmx.d entityContainer:entityContainer,fields:[{type:'mx.containers.HSplit',rows:controls:[{type:'mx.containers.TabControl',text選項(xiàng)卡name:layout:'AnchorLayout',controls:[{type:'mx.editors.TextEditor',name:'id',caption:"id",width:"50%",height:"20px",anchor:{left:'parent,20'}},'mx.editors.TextEditor',name:{text選項(xiàng)卡name:'tab2',controls:[{type:'mx.editors.TextEditor',name:'mx.editors.TextEditor',name:'confirmPassword'}]}]}]}]vardform=new vardfield=new varfirstNameEditor=newmx.editors.TextEditor({name:"fname"});varlastNameEditor=newmx.editors.TextEditor({name:"lname"});vartabControl=newname:”tab1”,text:”選項(xiàng)卡1name:”tab2”,text:”選項(xiàng)卡2var{{{{}]vargridEC=newmx.d var_grid=newmx.d vargridEC=new var_grid=newmx.d varvardataGrid=new{ yCheckBox:true,height:500, entityContainer:gridEntityContainer,columns:name:caption:"ID",{name:"name1",caption"Name分組1",statisticValue:{name:"name2",caption"Name分組2",statisticValue{name:"name3",caption"Name分組3",statisticValue{name:"name4",caption"Name分組4",statisticValue}]主要提供一個(gè)數(shù)據(jù)項(xiàng)列表控件（DataGrid）DataGridColumnDataGridcolumnsrenderCellvargrid_bdzmc= vargridECData{meta:{name:"bdzbh"caption:"變電站編號(hào)editorType:items:function(p_item,$p_cell)varvalue=for(vari=0;i<grid_bdzmc.length;i++){if(p_item.getValue("bdzmc")==value=}}}{name:"dydj"caption:"電壓等級(jí){name:"yxdw"caption:"運(yùn)行單位{name:"tyrq"caption:"投運(yùn)日期type:"local",primaryKey:"bdzbh",{bdzbh:"bzd-bdzmc:dydj:yxdw:"陜西省電力公司",tyrq:"2011-11-09"{bdzbh:"bzd-bdzmc:dydj:yxdw:"陜西省電力公司",tyrq:"2011-11-09"{bdzbh:"bzd-bdzmc:dydj:yxdw:"陜西省電力公司",tyrq:"2011-11-09"}vargridEC=newmx.d var_grid=newmx.d yCheckBox:true,//是否選中checkbox選擇框allowEditing:true,//表示該表格是否可以編輯columns:{name:"bdzbh",caption{name:"bdzmc",caption:"{name:"dydj",caption:"{name:"yxdw",caption:"{name:"tyrq",caption:"pageSize:3,//每頁(yè)顯示條數(shù)entityContainer:gridEC,//表格靜態(tài)數(shù)據(jù)源height:"97%"http://表格高度頁(yè)面顯示效果如下PagedControlvarvargridEC=newmx.dvar_grid=newmx.dontrols.DataGrid({searchBox:newmx.dontrols.DataGridSearchBox({Javascriptme.dataGrid=newmx.dsearchBox:newmx.dontrols.DataGridSearchBox({ Javaqc.addOrder(orders.re}}}}tree（靜態(tài)數(shù)據(jù)varbdzTreeNodes={id:"gs-{id:"gs-}]id:"gs- id:"gs- }vartreeEC=newmx.d varbdzTree=newmx.d ] DataFromfieldsGroupHeaderGridvarcolumns1=newmx.d ]me.gridentityContainer=newmx.d baseUrl:{webletid}.mappath("~/rest/tusertest/"),primaryKey:"id",loadMeta:falsevargrid=newmx.d [{[{{[{{}]}]{}entityContainer:vargrid=vargrid=new {name:"depid",caption部門IDeditorType:{name:"pardepid",caption:"上級(jí)部門",editorType"TextEditor"{name:caption:"部門名稱",editorType"TextEditor"}]LockHeaderGridvargrid=newmx.dontrols.LockHeaderGrid({ name"useridcaption用戶編號(hào)"},{name"usernamecaption用戶名,locked:true name"departmentidcaption部門"DropDownEditor" name:"age",caption:"" name"jobcaption職位 name:"phone",caption:"" name:"",caption:"郵箱" name"remarkcaption其他"}],vargridEntityContainer=newmx.d baseUrl:user.mappath("~/rest/mxuser/"),iscID1iscID是數(shù)據(jù)元素的統(tǒng)一權(quán)限功能編碼。默認(rèn)值為"-1primaryKey:loadMeta:vargrid=newmx.d entityContainer:gridEntityContainer, allowEditingfalse列表默認(rèn)不可編輯{name:"userid",caption用戶編號(hào)editorType:"TextEditor",{name:caption用戶名editorType:"TextEditor",{name"departmentid",caption:"部門",editorType:"DropDownEditor",{name:"userInfo",{name: caption:" ",editorType:"DropDownEditor"{name:caption:" ",editorType:"TextEditor"{name:caption:"職位",editorType"TextEditor"{name:caption:" ",editorType:"TextEditor" name: caption:"郵箱",editorType"TextEditor"{name:"remark",caption:"其他",editorType"TextEditor"}]}]varvargridEntityContainer=newbaseUrl:iscID1"iscID"-1primaryKey:_dataGrid=new {name:caption:"用戶編號(hào)",editorType"TextEditor"{name:"username",caption:"用戶名",editorType"TextEditor"{name:"departmentid",caption:"部門",editorType"DropDownEditor"} yCheckBox:true, allowEditing:false,//列表默認(rèn)不可編輯entityContainer:varvargidData={id:"1",orderdate:"2013-10-01",customer:"customer",price:"200.00",vat:"10.00",completed:true,shipment:"TN",total:{id:"2",orderdate:"2013-10-01",customer:"customer2",{id:"3",orderdate:"2011-07-30",customer:"customer3",vargridEntityContainer=new primaryKey:"id",loadMeta:false,varreportGrid=newoncellclick: 分別是@paramtd1等待合并的第一個(gè)@paramtd2等待合并的第二個(gè)@paramitem等待合并的第兩個(gè)td對(duì)應(yīng)的DataItem(因?yàn)檫@兩個(gè)td在同一@paramret返回值，這是一個(gè)jsonmergeCol:{if(td1.text()!=""&&{ret.merge=true;ret.mergeValue=td2.text();}@paramtd1等待合并的第一個(gè)@paramtd2等待合并的第二個(gè)@paramitem1等待合并的第一個(gè)td對(duì)應(yīng)的@paramitem2等待合并的第二個(gè)td對(duì)應(yīng)的@paramret返回值，這是一個(gè)jsonmergeCell:{if(td1.text()==td2.text()&&{ret.merge=true;ret.mergeValue=td2.text();}columns:{name:caption:"id",width:10{name"quechao",caption:"雀巢",{name:"orderdate",caption:"orderdate",width:20,editorType:{name:"customer",caption:"customer",width:20{name:"price",caption:"price",width:20{name:" caption大中華區(qū)",{name:"hd_area",caption華東區(qū)",{name:"completed",caption:"completed",width:{name:"shipment",caption:"shipment",width:15{name:"total",caption:"total",width:15}Window。$import("mx.windows.AjaxWindow")WindowManager。提供一個(gè)使用AJAX動(dòng)態(tài)加載技術(shù)實(shí)現(xiàn)的窗體基類。窗體在第一次顯示在瀏AjaxWindow的初始化邏輯，必須通過(guò)訂購(gòu)onload編寫，切勿通過(guò)重initvarajaxWinUrl=varwindowManager=varajaxwin=windowManager.create({IFrameinitvariframeWinUrl=varwindowManager=variframewin=windowManager.create({WindowWizard。varvarwizard=newmx.containers.Wizard();//初始化向?qū)?duì)象。varstep1=newvarstep2=newvarwindow=newmx.windows.WizardWindow({"wizard":wizardvarvarmsgBox=newmx.windows.MessageBox(reusable:true,//Booleantitle:"標(biāo)題",//一個(gè)字符串，表示彈出窗口的標(biāo)題。showOkButtontrue,/BooleanshowCancelButtontrue,/BooleanokButtonTextcancelButtonTextmessagewarnningerror|prompt可以調(diào)用時(shí)使用function(){alert(this.textEditor.text);}來(lái)獲取輸入框的值)okButtonCallback:FunctioncancelButtonCallback:Function}msgBox.show({}}},{TipsvarvarTipsBoxnewmx.windows.TipsBox({//newdisySpeed:500,//一個(gè)數(shù)字值（毫秒Tipsorientation"bottomleft",//兩個(gè)字符串值，用空格格開，第一個(gè)值是向滾動(dòng)方向，第二個(gè)值是tips框顯示的絕對(duì)位置。可用參數(shù)有："topright"|"bottomright"|"lefttop"|"righttop"|"bottomleft"|"topleft"|"rightbottom"|"leftwidth200,//Tipsheight100,//Tipsborder:"1pxsolid#9BDF70",//一個(gè)cssTipstitleBackground:"#C2ECA7",//一個(gè)cssTipsautoHide:true,//BooleanTips title:"Tips標(biāo)題",orientation:"topright"meta}屬性。DataForm以下是一個(gè)表單數(shù)據(jù)容器如何初始化并通過(guò)服務(wù)加載數(shù)據(jù)的代碼示例var varcontainer=newmx.d varsearchFormEntityContainer=newmx.d varskinUrlStr="~/bdqx/resources/searchBoxSkin.html";me.searchBox=new me.gridEntityContainer=newmx.d }DataGrid以下是一個(gè)表格數(shù)據(jù)容器如何初始化并通過(guò)服務(wù)加載數(shù)據(jù)的代碼示例varmx.dontainers.GridEntityContainer({"baseUrl":"~/rest/getData"});container.on("load",function(){alert("onload");//觸發(fā)onload。});varvardc=new DataTree以下是一個(gè)樹形數(shù)據(jù)容器如何初始化并通過(guò)服務(wù)加載數(shù)據(jù)的代碼示例var 。varcontainer=newmx.d DataParamsvardataParams=new vardataGrid=new 概述：mx.editorsEditor。（DataForm抽象類。提供所有編輯器的抽象基類。該類的派生類包含：CheckEditorComboEditor、ListEditor、UpDownEditor、TextEditortruefalseCheckEditorvarcheckEditor=new{CheckEditor 發(fā)onchanged 。詳見setValue方法。該示例將說(shuō)明如何創(chuàng)建一個(gè)CheckListEditor，以及如何訂購(gòu)varcheckListEditor=newCheckListEditoritems或隱藏下拉列表。該類的派生類包含：DateTimeEditor、DropDownEditorme.editor=mx.editors.CustomEditor({me.editor=mx.editors.CustomEditor({onclick:function{}var_dateTimeEditor=null;{_dateTimeEditor=newmx.editors.DateTimeEditor({var}}和不可編輯兩種模式，當(dāng)DropDownEditor.disyMember和控件支持編輯；當(dāng) 不同時(shí)，控件不支持編輯（ComboEditor.allowEditingDropDownEditor2（點(diǎn)擊“增加選項(xiàng)”按鈕后vardropDownEditor=null;{{dropDownEditor=new{ {}}}{vartoolBar=newmx.controls.ToolBar({}*網(wǎng)格列表 按鈕統(tǒng)一命令處 {{}}{}{}{}{}{}mx.editors.EditorFactoryEditorFactoryClass.createEditorvareditor=editor=mx.editors.EditorFactory.createEditor({checkedValue:"T",uncheckedValue"F",}p_editorTypeeditor=mx.editors.EditorFactory.createEditor({checkedValue:"T",uncheckedValue"F",}p_editorTypevareditor=mx.editors.EditorFactory.createEditor({myProperty1:"somevalue",myProperty2:"somevalue"提供一個(gè)允許用戶點(diǎn)擊進(jìn)行頁(yè)面跳轉(zhuǎn)或其他操作的編輯器的類以下是一個(gè)自動(dòng)跳轉(zhuǎn)的編輯器如何初始化的示例varlinkEditor=new 以下是一個(gè)自定義點(diǎn)擊動(dòng)作 編輯器如何初始化的示例varlinkEditor=new 。varlistEditor=new "items":[{text:"ListEditorListEditorNumberEditorvarnumberEditor=null;{numberEditor=newmx.editors.NumberEditor({{}}}{vartoolBar=newmx.controls.ToolBar({}*網(wǎng)格列表 按鈕統(tǒng)一命令處 *提供一個(gè)允許用戶點(diǎn)擊選 的類以下是一個(gè)編輯器如何使用的示例varvarpicEditor=picEditor=newpicEditor.moveTo(200,picEditor.resizeTo(200,編輯器調(diào)用文件為MainView.js,路徑如下varrichTextEditor=null;varrichTextEditor=null;{{richTextEditor=new{}}var_textEditor=null;var_textEditor=null;{{_textEditor=new{}var_textEditor=null;var_textEditor=null;{{_textEditor=new{}NumberEditor、TimeEditorvarvarannex=new{filePath:"D:\\",windowHeight:"400",width:baseUrl:me.detailForm=me.detailForm=new為1、以下是一個(gè)使用本地?cái)?shù)據(jù)創(chuàng)建DropDownTreeEditorvardropDownEditor=new{ yCheckBox:true,nodes:{id:text:" itemType:"item",hasChildren:{id:text:"江蘇",itemType:"folder",hasChildren:true,{id:"2-text:" itemType:"item",hasChildren:}]}onchanged:function{{alert("value}2、以下是一個(gè)使用URL創(chuàng)建DropDownTreeEditorvarvardropDownEditor=new{url:3rest(value="/tree/{id}/self",methodpublic@ResponseBodyWrappedResultgetNode(@PathVariableStringid,@ItemRequestParam("params")StringitemType){TreeNodenode=newTreeNode();if("uapbm".equals(p_itemType)){List<UapBm>uapbmList=treesceneBizc.listNode(UapBm.class,id, }elseList<UapSb>uapsbList=treesceneBizc.listNode(UapSb.class,id, }return} 以下是一 varedit=url:allowEditing:true, yMember:"text",valueMember:"value", plete(@RequestParam("term")Stringterm,@RequestParam("limit")intlimit){Randomrandom=newRandom();List<Map<String,String>>ret=newfor(intStringtext=term+random.nextInt(100);Stringvalue=text;Map<String,String>map=newHashMap<String,String>();}}ComplexFormDropDownGridEditor//DropDownGridEditor//DropDownGridEditor的創(chuàng)建有3vareditor=newmx.editors.DropDownGridEditor({name:"bm",caption所在部門 yCheckBox:true, {name"departId"caption部門IDeditorType:"TextEditor",visible:false},{name"departName"caption部門名editorType: pageSize:5,primaryKey:"objId",baseUrl:}TabControlmx.containers.TabControl。它提供一個(gè)分頁(yè)控件。把我的主頁(yè)’tabvar_tab=null;var_tab=null;{{_tab=newmx.containers.TabControl({tabvarentityContainer=newmx.d var_form=newmx.d var}}TabControlTabControlTabPage法詳細(xì)請(qǐng)參見VSplit，HSplit。VSplitHSplitVSplitvarsplit=newmx.containers.VSplit({varaccordion=new ]me.tabControl=newHSplitVSplitme.accordion=newmx.containers.Accordion({]varbutton1=newmx.controls.Button({text:"按鈕1"});varbutton2=newmx.controls.Button({text:"按鈕2"});varbutton3=newmx.controls.Button({text:"按鈕2"});DockPanelvardockPage_left=newmx.containers.DockPage({vardockPage_left=newmx.containers.DockPage({ //dockPage_left加到DockPanelvardockPanel_left=newmx.containers.DockPanel({dockPosition:"left"});DockPageHtml，jspDockPage。具體代碼如下所示：varhtmlContainer=new type:"IframeHtmlContainer有兩種模式ajax模式和Iframe模式；ajax模式加載varbtn=newmx.controls.Button({varlabel=newmx.controls.Label({varleftlabel=newmx.controls.Label({varrightlabel=newmx.controls.Label({varbottomlabel=newmx.controls.Label({varlayout=newmx.containers.PanelLayout({WizardStepWizardWindowWizardStep（Wizard）owner該步驟所屬的向?qū)?。WizardWindow表示一個(gè)包含向?qū)?duì)象的窗體，同時(shí)它還是HTMLWizard。WizardStepWizardWindow