htmlayout下拉组合框联动

By codex at 2020-11-02 • 0人收藏 • 231人看过
//动态下拉组合框
import win.ui;
/*DSG{{*/
var winform = win.form(text="下拉组合框联动";right=420;bottom=293)
winform.add()
/*}}*/

import console
import web.layout;
wbLayout = web.layout(winform);

wbLayout.html = /*
<meta charset="utf-8" />
<p>省份:<select #province size=1></select></p>
<p>城市:<select #city size=1><option value="0" >无选择</option></select></p>
*/

dataBind = function(id, data){
    //select第三个子节点 <popup> 的子节点才是 <option> 节点
    var ele = wbLayout.queryEle(id).child(3); 
    var n = ele.childCount()
    //清空 <option> 节点
    for(i=n;1;-1) ele.child(i).delete()
    // 下面绑定data表
    for(i=1;#data;1){
        ele.printf("<option value='%d'>%s</option>", i, data[i])
    }
    // 默认选中第一个选项
    wbLayout.queryEle(id).child(1).innerText = data[1]
    ele.child(1).state.checked = true
}

var city = {
    ["无选择"] = {"无选择"};
	["江苏省"] = {"南京市";"苏州市";"无锡市";"常州市"};
	["浙江省"] = {"杭州市";"宁波市";"温州市";"绍兴市"};
	["广东省"] = {"广州市";"深圳市";"珠海市";"东莞市"};
};
dataBind( "#province", {"无选择";"江苏省";"浙江省";"广东省"} ) 

var pSelect = wbLayout.queryEle("#province")
pSelect.onSelectSelectionChanged = function (ltTarget,ltOwner,reason,behaviorParams) {
    var ltOption = ..web.layout.element( behaviorParams.he )
    dataBind("#city", city[ltOption.value])
}
pSelect.attachEventHandler()

winform.show();
win.loopMessage();


6 个回复 | 最后更新于 2020-11-03
2020-11-02   #1
<select id="city"  size="1"  type="select-dropdown" >
	<caption value="1" >无选择</caption>
	<button role="dropdown"  tabindex="-1" ></button>
	<popup type="select" >
        	<option value="1" >无选择</option>
        	<option value="2" >江苏省</option>
        	<option value="3" >浙江省</option>
        	<option value="4" >广东省</option>
	</popup>
</select>

select 实际渲染出来的节点是上面这个样子的

2020-11-02   #2

多谢分享,昨天试了好久也没弄出来, 果然要多看文档吗

2020-11-03   #3

回复#2 @admin :

这个我也是

console.log( ele.outerHTML )

打印节点的html才看到的

2020-11-03   #4

编译个没有效果的exe打开,用官方的工具,爆源码,就能看到渲染过后正确的html结构树了

2020-11-03   #5

回复#4 @netfox :

那多麻烦 直接log()多省事

另 HTMLayoutSpy 不需要编译的 运行的窗体就可以看到了

2020-11-03   #6

回复#5 @codex :

是的,也可以,天天大路通罗马嘛

登录后方可回帖

登 录
信息栏
本站永久域名:HtmLayout.Cn
纯私人站,当笔记本用的,学到哪写到哪,目前在学aardio+halcon机器视觉.
Htmlayout界面在线学习文档
Sciter中文在线文档Sciter在线学习文档
本 站 主 站:Stm32cube中文网
Aardio 官方站:Aardio官方
Aardio最新功能:Aardio官方更新日志
aardio在线手册Aardio在线手册
C大Aardio论坛:Aar爱好者论坛
简码教程网:简码编程
AARDIO语言QQ群:70517368
赞助商:才仁机械
下载站:非凡软件站
Loading...