Combo box functionality in a text field

12/07/2011

A combo box is a combination of a drop-down list and a single-line textbox, allowing the user to either type a value directly into the control or choose from the list of existing options. Combo boxes are typically applied to provide autocomplete functionality in a way that is convenient to the user.

Our web-to-print extension for Magento supports combobox functionality in variable text fields out of the box. This post explains how to assign a combo box to a particular text field of a web-to-print or dynamic imaging template.

Assign a combo box to a text field

The combo box widget can be activated on any variable web-to-print text field. This is done through the field editor on the template’s page of your web-to-print portal.

Lets assign a combo box to a text field. Navigate to a template in your web-to-print portal and click on one of the field names in the input form to expand the field editor for that particular field.

Provide a few options in the list of values section. These will be the auto-complete suggestions for the field.

Note. Each value, must be in a separate line.

In the Magento only features section of the field editor, tick the Combo-box check-box and Save your settings.

The corresponding product page in Magento will show that field as a combo box in the input form.

With this functionality users can:

  • click on the drop-down arrow and select an option from the list of predefined values,
  • click in the input field, start typing and choose option from the auto complete that pops up,
  • click in input field and input an entirely new text that will be added to the list of options until user leaves the page.
See also: