如何在Lightning UI中重置组合框?

时间:2018-07-29 12:39:48

标签: javascript salesforce salesforce-lightning lightning

**我的照明用户界面中有两个带有一组选项的组合框。如果其他组合框中的选项已更改,我想重置一个组合框。

如何在Salesforce Lightning UI中动态重置组合框中的选项?**

2 个答案:

答案 0 :(得分:0)

不确定saleforce,但这是如何使用javascript重置选择框。

function myFn(){
select_box = document.getElementById("myselectbox");
select_box.selectedIndex = -1;
}
<select id="myselectbox" onchange="myFn()">
<option id="">select</option>
<option id="1">One</option>
<option id="2">two</option>
<option id="3">three</option>
</select>

答案 1 :(得分:0)

这里是一种完整的自定义方法。 闪电组件:comboboxExp.cmp

<aura:component>

<aura:attribute name="options" type="List" default="[
{'label': 'Apple', 'class': 'Apple', 'value': 'Apple'},
{'label': 'Microsoft', 'class': 'Microsoft', 'value': 'Microsoft'},
]"/>
<aura:attribute name="option2" type="List"/>

<lightning:combobox name="fonts" required="true" label="Manufacturer" placeholder="Choose a Manufacturer" options="{! v.options }" onchange="{! c.handleChange }"/>
<lightning:combobox name="fonts" required="true" label="Product" placeholder="Choose a Product" options="{! v.option2 }"/>

JS控制器:comboboxExpController.js

({
handleChange: function (cmp, event, helper) {
    helper.populateValueToSecondOption(cmp, event);
}
})

JS帮助器:comboboxExpHelper.js

({
populateValueToSecondOption : function(cmp, event) {
    var selectedOptionValue = event.getParam("value");
    if (selectedOptionValue == 'Apple') {
        this.createSecondOption('Apple', cmp, event);
    }
    else {
        this.createSecondOption('Microsoft', cmp, event);
    }
},

createSecondOption : function(value, cmp, event) {
    var options = [];
    if (value == 'Apple') {
        options.push(this.createObject('iphone', 'iphone', 'iphone'));
        options.push(this.createObject('macbook', 'macbook', 'macbook')); 
    }
    else {
        options.push(this.createObject('Windows OS', 'Windows OS', 'Windows OS'));
        options.push(this.createObject('Surface book', 'Surface book', 'Surface book'));
    }
    console.log(JSON.stringify(options));
    cmp.set('v.option2', options);
},

createObject : function(value, lebel, tempclass) {
    var obj = new Object();
    obj.label = lebel;
    obj.value = value;
    obj.class = tempclass;
    return obj;
}
})

希望它对您有帮助。谢谢。