How to change a form dropdown list selection using a method

I've got a form with a few dropdowns that are associated to static lists.  I need to drive the selection of the dropdowns to update based upon a graphic that's made of multiple HTML fields (basically a 5x5 grid).

- Dropdown1

- Dropdown2

Each grid box should have a value associated to the two dropdowns.

So what I want to do, is run a method onClick (or onSelect?) of the HTML fields, changing the selection of Dropdown1 and Dropdown2.

Looked through the various guides and couldn't find something applicable.  Could anyone assist with this?

  • Hi Jeff,

    your html shall influence the dropdown? Cool! It should be solvable, but it probably requires a lot of trial'n'error.

    1. Which Innovator version do you use? 11 or 12? This is important, cause dropdown related code changed a lot between these version.
    2. I assume you use the inbuild Aras standard dropdowns with lists.

    I would first try to set the selected dropdown values via button click:

    var myDropdown = getFieldComponentByName('mydropdown');
    myDropdown.component.setValue('myvalue1');

    *Code for Innovator 12

  • Thanks for the reply!  I am on version 12.

    That didn't quite work.  The dropdown uses a List.  Looking at the Programmer's & Developer's Guides there seem to be several references to setValue and setAttribute and also references to lists with ({ label:   XXX, value:  XXX}) but all of those examples are pointing to adding new values to the List, not selecting existing ones.

    I'm not a developer, so having to do fair bit of trial and error on this.  Thanks for the help.

  • I took the first best code sample that I thought it could fit. :-)

    I made a quick test with a custom button in the Part Form to set the make_buy dropdown:

    This one can set a dropdown value on button click. But it´s only a visual setting. The value is not stored in the item.

    var dropdownComponent = getFieldComponentByName("make_buy");
    dropdownComponent.component.setState({
    value: 'Make'
    });


    This variant did the best job. It updates the Form and ensures the correct label is stored:

    window.handleItemChange("make_buy", "Make");

    You can call this one also from custom html elements. So calling this one from a custom grid / table cells should work.

  • This worked perfectly on a button, thank you!!  For some reason doesn't want to behave on an HTML field "onclick", but I'll do some more digging on that.  Thanks again.