生成gridselect或组件select

wto.2008

您好！现用action查询语句查询到图中的数组返回到一个.w界面，页面接收数据后，想通过property（用“，”分隔开）动态生成select组件效果为：
表面： select下拉(有全粒面，半粒面，磨面，轻修面，修面，贴膜，反毛 ，毛皮这8个选项)
反面： select下拉(有1,2,3,4,这4个选项)
生成select的个数根据查询到的记录数动态生成，
这个应该怎么实现，关于动态生成select  并动态生成select选项有参考代码么？需要动态生成data组件把property字段的值放到里面再生成select 绑定对应的data么？还有在用户下拉选择select后怎样获取用户选到的值？

jishuang

获取到数据后，可以获取字段的值，然后js中字符串分隔遍历,data调用newData把遍历的数据新增到data中
动态创建的select关联这个data

动态创建参考
引用var select = require("$UI/system/components/justep/select/select");

1. 
   
2.         Model.prototype.button14Click = function(event) {
   
3.                 var parentNode = this.getElementByXid("content2");
   
4.                 var options = {
   
5.                         parentNode : parentNode,
   
6.                         xid : 'select1',
   
7.                         class : "form-control x-edit",
   
8.                         'bind-ref' : "data2.ref('fName')",
   
9.                         'bind-options' : "data1.datas",
   
10.                         'bind-optionsLabel' : "fName",
    
11.                         'bind-optionsValue' : "fValue"
    
12.                 };
    
13.                 new select(options);
    
14.         };

复制代码

wto.2008

jishuang 发表于 2017-11-14 10:24
获取到数据后，可以获取字段的值，然后js中字符串分隔遍历,data调用newData把遍历的数据新增到data中
动态 ...

那如果有8条记录需要分割生成8个select，是不是也要生成8个data，这个data怎么生成，里面的字段有多少个怎么定义?案例中的xiu都是‘select1’会不会有影响？

jishuang

1.可以用一个data,把数据都新增都一个data中，遍历data去找需要的数据，参考http://docs.wex5.com/comps-select/#008中最后一个案例
2.动态创建的设置不一样的xid，xid不能重复

wto.2008

jishuang 发表于 2017-11-14 10:44
1.可以用一个data,把数据都新增都一个data中，遍历data去找需要的数据，参考http://docs.wex5.com/comps-se ...

意思是我把property 里面的分割值放入itemdata中进行分类，然后下拉值放入mainDATA是么？那这两个data在js中怎么创建出来并给他们定义字段和属性呢？

jishuang

bind-ref和option关联的要是两个data啊

bind-ref关联的是你选择值后填充给谁
option中是从谁中下拉关联数据
model中添加一个data,自己给data定义一个主键字段和一个存你下拉数据的字段，自定获取到值后分隔调用这个data的newData给这个字段赋值
然后在select中通过定义函数的方式从这data中获取下拉需要的数据

wto.2008

jishuang 发表于 2017-11-14 15:49
bind-ref和option关联的要是两个data啊

bind-ref关联的是你选择值后填充给谁

还有个问题是select组件可以实现多选么，不行的话用gridselct动态生成能不能实现这个需求呢？一般推荐用哪一种

jishuang

select没有多选的设置
gridselect动态创建如下：
var GridSelect = require("$UI/system/components/justep/gridSelect/gridSelect");

1.         Model.prototype.button16Click = function(event) {
   
2.        
   
3.                 var parentNode = this.getElementByXid("content2");
   
4.                 var option = {
   
5.                         xid : 'dGridSelect',
   
6.                         optionCfg : {
   
7.                                 data : 'data1',
   
8.                                 value : 'fName',
   
9.                                 columns : [ {
   
10.                                         name : 'fName'
    
11.                                 } ]
    
12.                         },
    
13.                         'bind-ref' : "data2.ref('fName')",
    
14.                         multiselect : true,
    
15.                         parentNode : parentNode
    
16.                 };
    
17.                 new GridSelect(option);
    
18.         };

复制代码

不同的gridSelect下拉就需要用不同的data，不能像select那样定一个data，然后在函数中处理下拉的数据

wto.2008

jishuang 发表于 2017-11-14 17:16
select没有多选的设置
gridselect动态创建如下：
var GridSelect = require("$UI/system/components/justep ...

那用gridselect的话 有8条数据想生成8个gridselect是要创建8个data的意思么？

jishuang

是的