Appian Community
Site
Search
Sign In/Register
Site
Search
User
DISCUSS
LEARN
SUCCESS
SUPPORT
Documentation
AppMarket
More
Cancel
I'm looking for ...
State
Not Answered
Replies
2 replies
Subscribers
8 subscribers
Views
1090 views
Users
0 members are here
Share
More
Cancel
Related Discussions
Home
»
Discussions
»
User Interface
Hi All, I have a normal grid, in this grid I have a image column and
Sumeet Khare
over 11 years ago
Hi All,
I have a normal grid, in this grid I have a image column and a drop down column. I want to change the selected value of the drop down on click of image. Please let me know how can we do that?...
OriginalPostID-99022
OriginalPostID-99022
Discussion posts and replies are publicly visible
0
Eduardo Fuentes
Appian Employee
over 11 years ago
This can be achieved using JavaScript to add a handler to the click event of the image and the Advanced Form Utilities to update the dropdown but I have to emphasize on the fact that JavaScript should be avoid so you can eventually make your form mobile enabled or to be able to expose it on Tempo for a wider compatibility with other browsers.
You could consider using a GridSelection component with images and loop back to the form updating the value of the dropdown within the process through activity chaining
forum.appian.com/.../SAIL_Components
Cancel
Vote Up
0
Vote Down
Sign in to reply
Verify Answer
Cancel
0
Eduardo Fuentes
Appian Employee
over 11 years ago
If you are still interested in the JavaScript approach (not recommended) you can add the click event to the rows in the image column within that specific grid. The following function adds it to all the image columns and shows the index of the clicked row within the column.
This is a quick solution if you have only one image column, if you have more than one the other columns will get the click event too. At least it should be enough if you just have one column of type image or you can take this code as a reference, explore the grid using IE Developer Tools and improve the function
function addClickEventToRow(gridID) {
$("#fd_component_"+window.FormDesigner.runtimeNamespace+gridID+" .imageControl").click(function(){
alert("Image Clicked Number: " + $("#fd_component_"+window.FormDesigner.runtimeNamespace+gridID+" .imageControl").index(this));
});
}
The function retrieves all the elements with the class “imageControl” out of the given grid. The index function returns the id within the resulting array (from the retrieval of all elements with the “imageControl” class.
This function can be invoked in the load event of the form with the corresponding setTimeout to allow the component to be rendered.
I am attaching an example application that shows this function in action. The model is called Click Image in Row under Process Models – Forum. The JS is called clickRowEvent.js under Default Community > Temporary Documents Knowledge Center > Temporary Documents>JS libraries. Click on each image and see how the alert indicates which row was clicked, your case you can use that same logic but instead of showing the alert you can update the dropdown with the Advanced Form Utilities plug-in.
forum.appian.com/.../16214
Cancel
Vote Up
0
Vote Down
Sign in to reply
Verify Answer
Cancel