Multiple forms in the screen

I have a screen with a search box (text field with button) on the top right end of all pages (its a webblock and used in all pages). Now when i open the screen in the browser and try to submit the page by hitting enter button, the search box button is clicked. When i viewed the source of the page, i observed that only one form element is created. So my question here is, i need to have a seperate form for search box and rest of the page. When i am in search field and hit enter, it should do the search and if i am in other fields of the page and hit enter, it should submit the page form. How can i achieve this.

Also, when Is default property is set to FALSE, the input type is still submit, it is not changing to button.


PS: As a workaround, i have added type attribute in the extended property for the search button as button and doing a javascript submit when user is in search field and hitting enter. I dont want to do this. Is there a way in outsystems to do it properly.

Hi Thirupathi,

The generate page contains only one form element, thus you can only have one default button on the page that submits the form. Even if you set all buttons to be not default you wouldn't get the desired behavior.
An option, but still a workaround, would be to inject another form inside the existing one, you can have a lot at this blog post Be aware that W3C specification doesn't consider valid to have a form element inside another form element as indicated here:

Seems to me you already have the best workaround ;)


Hi again :)

Yet I found another way to work around it, with the help of Tiago Simões. You can have more than one default button if you use web blocks.
This way you can submit different forms pressing the Enter key, at least it works like this on Chrome...
Check the attachment.
Thanks Andre! Appreciate your help. Let me try out and get back to you.

Hi Andre,

Our user experience team may not agree to have embeded forms as it is not W3C specification. So i cannot use that option.

I have also gone through your attachment and it will not help me. In this case, if i have the web block first and then screen form fields, if I place cursor on the grey area and press enter, it gives a message "Form2". So the first submit button is cliked when i press enter. This will not work for me as my search box will come first.

You can try this by intechanging the web block and attribute on screen in your attachment.

Anyways, i personally feel to have optionally form to be managed by the developer in studio if required, just like additional properties which can be provided on the block or the screen. I understand this may break other attributes like action, onsubmit, method .... which are provided by default.

Let me stick to workaround what i am using. Please let me know if you have anything better than the two what you have proposed.

Thanks for your help,