MiniUI知识点汇总汇总Word格式.docx
- 文档编号:3058116
- 上传时间:2023-05-01
- 格式:DOCX
- 页数:53
- 大小:341.75KB
MiniUI知识点汇总汇总Word格式.docx
《MiniUI知识点汇总汇总Word格式.docx》由会员分享,可在线阅读,更多相关《MiniUI知识点汇总汇总Word格式.docx(53页珍藏版)》请在冰点文库上搜索。
200"
expanded="
west
east"
showCloseButton="
east
center"
inputtype="
button"
value="
隐藏"
onclick="
hideHeader()"
/>
显示"
showHeader()"
br/>
折叠"
collapsePanel()"
展开"
expandPanel()"
scripttype="
text/javascript"
mini.parse();
//将html标签解析为miniui控件。
//解析后,才能使用mini.get获取到控件对象。
varlayout=mini.get("
);
functionhideHeader(){
layout.updateRegion("
{visible:
false});
//更新region面板
//
}
functionshowHeader(){
true});
functioncollapsePanel(){
{expanded:
functionexpandPanel(){
/script>
1.2splitter分割器mini-splitter
h4>
横向分割器<
/h4>
divclass="
mini-splitter"
350px;
200px;
divsize="
30%"
showCollapseButton="
padding:
5px;
1
divshowCollapseButton="
2
竖向分割器<
vertical="
1.3window弹出面包mini-window
show(left,top)
showAtPos(left,top)
left:
left,center,right
top:
top,middle,bottom
弹出显示面板
x:
selectid="
x"
optionvalue="
left"
Left<
/option>
Center<
right"
selected>
Right<
/select>
y:
y"
top"
Top<
middle"
Middle<
bottom"
Bottom<
showAtPos"
showAtPos()"
win1"
mini-window"
title="
Window"
250px;
showMaxButton="
showShadow="
showToolbar="
showFooter="
showModal="
allowResize="
allowDrag="
divproperty="
toolbar"
inputtype='
button'
value='
Hide'
hideWindow()"
style='
vertical-align:
middle;
'
footer"
text-align:
right;
padding-right:
15px;
1<
1<
functionshowAtPos(){
varwin=mini.get("
varx=document.getElementById("
).value;
vary=document.getElementById("
win.showAtPos(x,y);
functionhideWindow(){
win.hide();
showAtPos();
二、forms表单
2.1spinner下拉列表组建
inputid="
sp1"
mini-spinner"
minValue="
100"
maxValue="
250"
/>
minValue最小值maxValue最大值
allowLimitValueBoolean是否强制约束大小范围true
changeOnMousewheelBoolean是否滚动滚轮改变值true
2.1.1mini-timespinner
tsp1"
mini-timespinner"
format="
H:
mm"
2.2ButtonEdit按钮弹出框
btnEdit1"
mini-buttonedit"
onbuttonclick="
onButtonEdit"
functiononButtonEdit(e){
varbtnEdit=this;
mini.open({
url:
"
MultiSelectTreeWindow.html"
title:
多选树"
width:
350,
height:
ondestroy:
function(action){
if(action=="
ok"
){
variframe=this.getIFrameEl();
vardata=iframe.contentWindow.GetData();
data=mini.clone(data);
btnEdit.setValue(data.id);
btnEdit.setText(data.text);
}
}
});
}
valuechanged值改变时发生
buttonclick按钮点击时发生
validation验证时发生
enter回车时发生
keydown键盘按下时发生
keyup键盘按起时发生
focus获取焦点时发生
blur失去焦点时发生
closeclick点击关闭按钮时激发
2.3CheckBox复选框
ck1"
name="
product"
mini-checkbox"
checked="
readOnly="
text="
大堂经理"
onvaluechanged="
onValueChanged"
checkedchanged选中变化时发生
click点击时发生
2.4button按钮mini-buttonmini-button-iconTop
aclass="
mini-buttonmini-button-iconTop"
iconCls="
icon-add"
onClick"
增加<
/a>
icon-edit"
修改<
functiononClick(e){
varbutton=e.sender;
variconCls=button.getIconCls();
vartext=button.getText();
if(iconCls){
alert("
text:
+text+"
\nicon:
+iconCls);
}else{
alert(text);
2.5TreeSelect树状选择框mini-treeselect
select1"
mini-treeselect"
url="
../data/listTree.txt"
multiSelect="
textField="
text"
valueField="
id"
parentField="
pid"
checkRecursive="
showFolderCheckBox="
expandOnLoad="
showClose="
oncloseclick="
onCloseClick"
popupWidth="
functionsetValue(){
varobj=mini.get("
obj.setValue("
base,button,ajax"
functiongetValue(){
alert(obj.getValue()+"
:
+obj.getText());
functionenable(){
obj.enable();
functiondisable(){
obj.disable();
functiononCloseClick(e){
varobj=e.sender;
obj.setText("
单选:
禁止选中父节点<
select2"
valueFromSelect="
control"
onbeforenodeselect="
beforenodeselect"
allowInput="
showRadioButton="
functionbeforenodeselect(e){
//禁止选中父节点
if(e.isLeaf==false)e.cancel=true;
2.6Hidden隐藏字段mini-password
单行输入框:
tb"
mini-textbox"
emptyText="
请输入商品编号"
vtype="
email"
密码输入框:
inputclass="
mini-password"
12345"
多行输入框:
textareaclass="
mini-textarea"
请输入备注"
/textarea>
2.7RadioButtonList单选框组mini-radiobuttonlist
rbl"
mini-radiobuttonlist"
repeatItems="
2"
repeatLayout="
table"
repeatDirection="
vertical"
cn"
../data/countrys.txt"
varrbl=mini.get("
rbl.on("
valuechanged"
function(e){
alert(this.getValue());
});
2.8form表单验证
form1"
table>
tr>
td>
labelfor="
username$text"
帐号:
/label>
/td>
inputname="
username"
required="
requiredErrorText="
帐号不能为空"
/tr>
pwd$text"
密码:
pwd"
minLength:
5"
minLengthErrorText="
密码不能少于5个字符"
inputvalue="
Login"
type="
submitForm()"
/table>
functionsubmitForm(){
varform=newmini.Form("
#form1"
form.validate();
if(form.isValid()==false)return;
//提交数据
vardata=form.getData();
varjson=mini.encode(data);
提交成功"
2.9TextBox文本输入框mini-textbox
vtype
String
验证规则。
如vtype="
。
参考示例。
2.10DatePicker日期选择器mini-datepicker
date1"
mini-datepicker"
2010-01-01"
2.11FileUpload文件上传控件(flash实现)。
mini-fileupload
fileupload1"
mini-fileupload"
Fdata"
limitType="
*.txt"
flashUrl="
swfupload/swfupload.swf"
uploadUrl="
upload.aspx"
onuploadsuccess="
onUploadSuccess"
onuploaderror="
onUploadError"
onfileselect="
onFileSelect"
br/>
上传"
startUpload()"
//动态设置url
//varfileupload=mini.get("
//fileupload.setUploadUrl("
functiononFileSelect(e){
//alert("
选择文件"
functiononUploadSuccess(e){
上传成功:
+e.serverData);
this.setText("
functiononUploadError(e){
functionstartUpload(){
varfileupload=mini.get("
fileupload.startUpload();
buttonTextString按钮文本
limitTypeString文件限制类型。
如"
*.bmp;
limitSizeString文件尺寸限制
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- MiniUI 知识点 汇总
![提示](https://static.bingdoc.com/images/bang_tan.gif)