# Combo box The **Combo Box** option type is a versatile selection tool that combines the functionality of a dropdown menu with the flexibility of checkboxes, allowing customers to select multiple options from a list. This option type is ideal for products that offer various add-ons or configurations, enabling customers to customize their purchases easily. When an option is selected, it will appear right under the option box, giving a clear view of all chosen items. 👉You can check out our [Demo prouduct](https://avis-demo.avisplus.io/products/unlimited-options) to see how it works *** ## **Basic Option Settings:**
#### **1. Option Name** The internal name used to manage and identify this combo box option within your app. This helps with organization and tracking of different product options. #### **2. Label on Product** The label displayed next to the combo box on the product page. It guides customers on what the combo box represents (e.g., "Select Add-ons" or "Choose Accessories"). #### **3. Label on Cart** This label appears in the shopping cart, order details, invoices, packing slips, order confirmation emails, and other order-related documents, showing the selected options clearly. #### **4. Option Values** Add the different options available in the combo box. You can include multiple values, and customers can select more than one. These values can be added individually using "Add option value" or in bulk using the "Bulk add" feature. #### **5. Default Value** Set a default selection that will be pre-selected when the product page loads, helping guide customers toward recommended or popular choices. #### **6. Required Field** Make it mandatory for customers to select at least one option from the combo box before adding the product to their cart. This ensures that all necessary choices are made. #### **7. Hide "Label on Product"** Option to hide the label next to the combo box on the product page, providing a cleaner and more streamlined appearance. #### **8. Show "Quantity" for Option Value** Enable customers to specify the quantity for each selected option in the combo box. You can set minimum and maximum quantity limits for better control. #### **9. Add description for option value** You can add a descriptive text below the option value to provide additional information about the selection. #### **10. One Time Charge** This setting allows you to modify how additional charges are applied to a specific option value. Normally, the extra charge for an option is multiplied by the quantity of the product purchased (e.g., an additional charge of $10 would become $50 if the quantity is 5). However, by enabling the "One time charge" feature, the extra charge will only be added once, regardless of the product quantity. This is useful when you want to apply a flat fee for certain options without scaling the charge with the number of items purchased. #### **11. Min/Max Selection** Set minimum and maximum limits on the number of options that can be selected from the combo box, providing greater control over customer choices. #### **12. Option URL** Allows you to link specific options within the combo box to external URLs. Customers can be directed to another page or site for additional information when selecting certain options. {% hint style="info" %} [How to set up Option URL for your options](https://options-docs-v2.avisplus.io/app-features/option-url-feature) {% endhint %} #### **13. Conditional Logic** Apply conditional logic to control when certain options in the combo box are displayed based on other selections made by the customer, enhancing the shopping experience. {% hint style="info" %} [How to set up Conditional logic for your options](https://options-docs-v2.avisplus.io/app-features/conditional-logic-option-b-shows-if-option-a-is-selected) {% endhint %} *** ## **Advanced Option Setting:**
**1.** **Change product image on option selection** When the product image alt text aligns with the option value labels and the theme setup is correct, enabling this feature will update the product image according to the selected option. {% hint style="info" %} [How to change product image upon option selection](/storefront-display/change-product-image-upon-option-selection.md) {% endhint %} **2. Price display type** Decide whether to **show or hide** the additional price on the slider interface. **3. Enable search** This feature will allow customers to **search within the option values** in color or image dropdowns, making it easier and faster for them to find and select what they need. **4. Show price** Customize how pricing is displayed with these options: * *Only Option Value:* Show price next to the option value. * *Only Option Label:* Show price next to the label. * *Show All:* Display prices with both label and value for maximum transparency. #### **5. Placeholder Text** Add placeholder text in the combo box before any selection is made. This can prompt customers to make a choice (e.g., "Please select your options"). #### **6. Tooltip** Provide additional information about each option by adding tooltips. When customers hover over an option, the tooltip will display, offering further details. #### **7. Help Text** Display help text below the combo box to offer further explanation or instructions, helping customers make informed selections. #### **8. Class Name** For advanced customization, add custom CSS class names to the combo box. This allows you to style it according to your brand’s design standards, ensuring a cohesive look across your product page. --- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://options-docs-v2.avisplus.io/option-types/all-option-types/combo-box.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.