How do I include an element in a form but separate it physically in the layout

Question

So given a layout like so:

How can I include the value of ComboBox in the submission of the form.

Things that have occurred to me:

1. Include the combo box as part of the form in terms of markup and position it absolutely. I'm don't get how this would work if the page needs to resize and the combo should remain where it it is in this title bar.
2. On submission use JS to grab the value and insert it in a hidden field as part of the form submission. This would clearly break without JS but the page is client facing and we are willing to stipulate that JS is required.

I believe I have stated all the restrictions so given that is there another approach? If not how should I choose between the above options?

Answer 1

With out seeing some HTML its hard to determine the layout you have. But my first thought would be to use Absolute positioning with CSS.

The other option would be to incorporate the entire page as a part of the form, but this may not be possible due to other functionality on the page that may be necessary

Answer 2

You obviously could use aa giant form tag.

OR

Two forms, changing the combo and submitting does a full post and adds a hidden to the main form. Then sexy it up with JavaScript (prevent the full post back, and remove the submit button on the combo form)

OR

CSS Positioning as you suggest.

Answer 3

I would say use javascript.

1. have a hidden input field in the form.
2. on page load, that input is populated with the ComboBox value.
3. update the value if the ComboBox select is changed.