Skip to main content
S
schakravarthy1-Visitor
1-Visitor
July 27, 2018
Question

can images be changed dynamically based on item selection in list

  • July 27, 2018
  • 4 replies
  • 2252 views

Hi ,

 

I have this requirement  :  I will display a list containing bike's model names and i want to represent the respective images for each and every model , so as i select model-1 i want the image of model-1 to be displayed ...likewise i want to change the image to model-2 when i click on model-2 in the list .

 

Pls tell me how to achieve this ...

 

Thanks

4 replies

W
wposner-21-Visitor
1-Visitor
July 30, 2018

Yes you can do this.  You just need to pass your selected item from the service that is populating your list widget to another service that returns the image URL (or image) based on the selected value.  This is a very simple service of consisting of an "if then else" statement (or multiples--depending on how many images you want to return).  A more elegant JS approach would be a case statement. 

Z
zyuan15-Regular Member
5-Regular Member
July 30, 2018

Hi,

 

Mapping your model name selection in the List to find the image with a service would be complex. You only need a Datatable/ Stream, and in their datashape you add the "model name" and the "image"/ "image link" inside, and then map this infotable result from some getDatatableEntries service to the List widget (model name) and the ValueDisplay widget (image). Since the name and the image are in the same row of the infotable, they will automatically match to each other when you select different names in the List and display the corresponding image in the ValueDisplay widget

W
wposner-21-Visitor
1-Visitor
July 30, 2018

This approach requires the OP to completely refactor their code.  Based on the initial question, it's apparent that the OP has little experience with TWX so your suggestion, while correct, is more complicated than what the OP may be able to implement.  So without changing any underlying code, they only have to add one additional service that matches the desired image url to the selected item, include the service on their mashup, set it to execute on the SelectedItemChanged event and then bind the result of that service to their value display widget.

Z
zyuan15-Regular Member
5-Regular Member
July 31, 2018

Well, I'm providing the solution for this and future reference, since it's much easier and effective to change the datashape than adding a service each time they need such a function in TWX.

 

For new clients asking this kind of questions, they are more likely in TWX testing period than in a production environment which requires hot-fix in the problem, so I would suggest them to try more approaches. If they only need a little number of pictures to display, surely a if...else script could solve the problem, but if there's more pictures need to be presented and mapped to each condition, the infotable solution would be much easier to manage, thanks.

Terms & ConditionsAccessibility statement