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?

Parents
  • 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.

Reply
  • 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.

Children
  • 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.