I would like two make two ui.Select
widgets. The items of second ui.Select
depends on first ui.Select
. Then I would like to get values of both ui.Select
s using ui.Button
. I have drafted a code, but it does not work as I want. When I click the button, it gets the value of first ui.Select
and prints it, but ignores the second ui.Select
's value. Is anyone can help me improve the code and give an suggest how can I make it?
https://code.earthengine.google.com/1796c9feaca7638dc195f52850bca64c
var panel = ui.Panel();
panel.style().set({width: '200px', position: 'bottom-right'});
ui.root.add(panel);
var firstname_select = ui.Select({
items: [{label:'AAA', value:'AAA'}, {label:'BBB', value:'BBB'}, {label:'CCC', value:'CCC'}],
onChange: function() {
if (firstname_select.getValue() === 'AAA'){
var secondname_select = ui.Select({
items: [
{label:'A1', value:'A1'}, {label:'A2', value:'A2'}, {label:'A3', value:'A3'}],
onChange: function() {
}
});
}
if (firstname_select.getValue() === 'BBB'){
var secondname_select = ui.Select({
items: [
{label:'B1', value:'B1'}, {label:'B2', value:'B2'}, {label:'B3', value:'B3'}],
onChange: function() {
}
});
}
if (firstname_select.getValue() === 'CCC'){
var secondname_select = ui.Select({
items: [
{label:'C1', value:'C1'}, {label:'C2', value:'C2'}, {label:'C3', value:'C3'}],
onChange: function() {
}
});
}
panel.widgets().set(1, secondname_select);
}
});
var getvalue = ui.Button({
label: 'Get Values',
onClick: function() {
print('First: ' + firstname_select.getValue());
print('Select: ' + secondname_select.getValue());
}
});
var secondname_select = ui.Select();
panel.widgets().set(1, firstname_select);
panel.widgets().set(2, secondname_select);
panel.widgets().set(3, getvalue);