Hi There,
I would like to know if there is a way of setting the value/text of the option you have selected in a list control to a label?
With a select control i was doing this:
Appery("label_control").text(Appery("select_control").val());
Thanks
Hi Meyrick,
There multiple ways to do this using JavaScript. I prefer to do it visually (easier for me). I have shared a sample project with this example with your email:
- Create the basic screen
- Map the data to List Item.
(If you have more than one field to display, you can place labels inside the List Item and map to the labels. This solution would also work for that situation by mapping the labels to a local variable on click of the List Item):
- Now I would go back to the Design Screen and add an event on the List Item to map whatever I selected to a LocalStorageVariable. On this simple sample, I am mapping the TEXT on the List Item line. If I had multiple labels inside the List Item Line, I would map the labels I needed to different Local Storage Variables:
- Now that I have the value that was selected inside the selected_value LocalStorageVariable, I create another event that will display that value on the component in the screen (label_control):
With this second event to List Item, you should have the following events:
And that's it. I use this trick a lot! It saves me tons of time with JavaScript. Below is the result:
Remember, this is just a sample, but you can apply the same concept with multiple values (using labels) and you can use the LocalStorageVariable to display the information on the Screen, but I also use it a lot to send the selected information to other screens.
Hope it helps,
Ricardo Perdigao
Hi Meyrick,
Is this a dynamically populated list? Or a fixed list?
Thanks in advance,
Ricardo
Hi Meyrick,
There multiple ways to do this using JavaScript. I prefer to do it visually (easier for me). I have shared a sample project with this example with your email:
- Create the basic screen
- Map the data to List Item.
(If you have more than one field to display, you can place labels inside the List Item and map to the labels. This solution would also work for that situation by mapping the labels to a local variable on click of the List Item):
- Now I would go back to the Design Screen and add an event on the List Item to map whatever I selected to a LocalStorageVariable. On this simple sample, I am mapping the TEXT on the List Item line. If I had multiple labels inside the List Item Line, I would map the labels I needed to different Local Storage Variables:
- Now that I have the value that was selected inside the selected_value LocalStorageVariable, I create another event that will display that value on the component in the screen (label_control):
With this second event to List Item, you should have the following events:
And that's it. I use this trick a lot! It saves me tons of time with JavaScript. Below is the result:
Remember, this is just a sample, but you can apply the same concept with multiple values (using labels) and you can use the LocalStorageVariable to display the information on the Screen, but I also use it a lot to send the selected information to other screens.
Hope it helps,
Ricardo Perdigao
Hi Ricardo,
Thanks for that information, it will be very helpful to me. The other issue I am having with a list control is that it is only being populated when you search in the search control and that onclick event does not work with that because it always uses the first record in the list control and not the record i select.