Button group value changes when pressing Enter. With solution!!!

I have a very simple screen bases on a query on a local table Person with 3 fields (Firstname, Surname and Gender) The values of the Gender come from a static entity with 2 values Male and Female.

 The form is showing the firstname and surname of the person in Input-fields

The gender is shown in a button-group with 2 options: Male and Female.

Both input fields have a Save action attached to the onblur-event. This action just saves the Person, nothing else. This same action is called from the OnChange of the button-group. 

Important: There is no "Save" button (our sales force does not want this)


The problem:

When I chose Female (the second option), then go to one of the input-fields and press "Enter" the option Male is automatically chosen and the persons Gender is updated.. This is unexpected and undesired behaviour.


----- 1 hour later ---

After some searching and tyring I found a solution. 

The buttons in the button-group have no type specified.  By default the type is probably "submit"

When I press "Enter" the first button in the form is selected and a submit is performed.


Adding the attribute "type" with value "button" solves it, No changes in the button-group and database.


Question for Outsystems:

Shouldn't it be better to render type="button" for buttons in a button-group by default.

It is very unlikely that they are used as submit buttons.


 

Solution

Hi Gert-Jan

Please submit this as idea to be reviewed by Outsystems team.

Thanks and Regards,

Suraj Borade


Solution

ok, I wil

Thanks Gert-Jan Vernooij, you saved me today.


I am using the ButtonGroup for criteria to filter some records on a list screen. Earlier I had 'Search' buttons to apply the filters. Our product side people asked me to remove the 'Search' button and see if the software keyboard's search button can be used instead. So after looking at a few articles, I figured that out and removed the 'Search' button. The solution required to add  OnSubmit event handler in the form. After this change, the buttons in the ButtonGroup widget changed their behavior to 'submit' type buttons. I was debugging the code to understand why the OnChange event of the ButtonGroup was not firing anymore when I selected one of the buttons from the ButtonGroup.


For anybody else coming to this page for help, the 'type=button' needs to be specified in the buttons of the ButtonGroup.


Gert-Jan Vernooij wrote:

I have a very simple screen bases on a query on a local table Person with 3 fields (Firstname, Surname and Gender) The values of the Gender come from a static entity with 2 values Male and Female.

 The form is showing the firstname and surname of the person in Input-fields

The gender is shown in a button-group with 2 options: Male and Female.

Both input fields have a Save action attached to the onblur-event. This action just saves the Person, nothing else. This same action is called from the OnChange of the button-group. 

Important: There is no "Save" button (our sales force does not want this)


The problem:

When I chose Female (the second option), then go to one of the input-fields and press "Enter" the option Male is automatically chosen and the persons Gender is updated.. This is unexpected and undesired behaviour.


----- 1 hour later ---

After some searching and tyring I found a solution. 

The buttons in the button-group have no type specified.  By default the type is probably "submit"

When I press "Enter" the first button in the form is selected and a submit is performed.


Adding the attribute "type" with value "button" solves it, No changes in the button-group and database.


Question for Outsystems:

Shouldn't it be better to render type="button" for buttons in a button-group by default.

It is very unlikely that they are used as submit buttons.