3

How to change qty text box into dropdown in minicart place view/frontend/web/template/minicart/item/default.html file ?

2

Override default.html to your theme

From vendor/magento/module-checkout/view/frontend/web/template/minicart/item/default.html

TOapp/design/frontend/Vendor/theme/Magento_Checkout/web/template/minicart/item/default.html

Now change

<input data-bind="attr: {
       id: 'cart-item-'+item_id+'-qty',
       'data-cart-item': item_id,
       'data-item-qty': qty,
       'data-cart-item-id': product_sku
       }, value: qty"
       type="number"
       size="4"
       class="item-qty cart-item-qty">
<button data-bind="attr: {
       id: 'update-cart-item-'+item_id,
       'data-cart-item': item_id,
       title: $t('Update')
       }"
        class="update-cart-item"
        style="display: none">
    <span data-bind="i18n: 'Update'"></span>
</button>

To

<select data-bind="attr: {
       id: 'cart-item-'+item_id+'-qty',
       'data-cart-item': item_id,
       'data-item-qty': qty,
       'data-cart-item-id': product_sku
       }, value: qty"
       class="item-qty cart-item-qty">
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
    <option>5</option>
</select>
<button data-bind="attr: {
       id: 'update-cart-item-'+item_id,
       'data-cart-item': item_id,
       title: $t('Update')
       }"
        class="update-cart-item">
    <span data-bind="i18n: 'Update'"></span>
</button>

Now flush cache and run static:content:deploy to see changes

OUTPUT:

enter image description here

  • Are you remove display:none from button? You should click on update button to update qty after changing qty from dropdown – Prince Patel Dec 26 '17 at 6:22
  • Yes.I have removed it.i can update qty.But the updated qty value (selected value) not displayed in qtybox.But that selected value can be updated – Mano M Dec 26 '17 at 6:27
  • It should be there because value: qty already passed in qtybox. Working good in my setup. Please check with private window. – Prince Patel Dec 26 '17 at 6:30
  • yes qty is showing... – Mano M Dec 26 '17 at 6:40
  • How to pass option value dynamically – Mano M Dec 26 '17 at 15:48

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.