Duplicate selected Devexpress ComboBox value to other text fields

Question

I have a DevExpress ComboBox to select an amount unit (g, mg, l, etc.) for an amount field.

@Html.DevExpress().ComboBoxFor(     model => model.PackageAmountUnit,
                                    settings =>{settings.Width= 60;}
                                    ).BindList(args => this.Model.Units, args => this.Model.Units).GetHtml()

I have two other amount fields on the page but the units of these fields have to be the same as the selected unit of the first amount field. So I want to duplicate the selected unit value of the DevExpress ComboBox and duplicate it to the other two unit fields which are just text fields (so no user input possible).

Here's an example

Is there a way to get the selected value via JavaScript or is there another way to do this?

Thank you

Answer 1

You can do this in Javascript by adding a handler for the ValueChanged event of the ComboBox.

<script type="text/javascript">
function OnComboChanged(s,e){
    var comboValue = PackageAmountUnit.GetValue();
    AmountField.SetValue(comboValue);
}
</script>


@Html.DevExpress().ComboBoxFor(     model => model.PackageAmountUnit,
                                    settings =>{
                                         settings.Width= 60;
                                         settings.Properties.ClientSideEvents.ValueChanged = "OnComboChanged";
                                    }
                                    ).BindList(args => this.Model.Units, args => this.Model.Units).GetHtml()

This question response from DevExpress may also help" https://www.devexpress.com/Support/Center/Question/Details/Q349035

This documentation may also help https://documentation.devexpress.com/#AspNet/DevExpressWebScriptsASPxClientEditBase_GetValuetopic.