1

I want to add a multi checkbox of days of the week to the checkout, similar to:

Following the instructions on the Magento Docs - Add a new input form to checkout I have added the following item to my checkout_index_index.xml layout file:

<item name="delivery_days" xsi:type="array">
    <item name="component" xsi:type="string">Magento_Ui/js/form/element/checkbox-set</item>
    <item name="config" xsi:type="array">
        <item name="customScope" xsi:type="string">shippingAddress.custom_attributes</item>
        <item name="template" xsi:type="string">ui/form/field</item>
        <item name="elementTmpl" xsi:type="string">ui/form/element/checkbox-set</item>
    </item>
    <item name="provider" xsi:type="string">checkoutProvider</item>
    <item name="dataScope" xsi:type="string">shippingAddress.custom_attributes.delivery_days</item>
    <item name="label" xsi:type="string" translate="true">What days do you wish to receive your order?</item>
    <item name="validation" xsi:type="array">
        <item name="required-entry" xsi:type="string">true</item>
    </item>
    <item name="options" xsi:type="array">
        <item name="monday" xsi:type="array">
            <item name="label" xsi:type="string" translate="true">Monday</item>
            <item name="value" xsi:type="string">monday</item>
        </item>
        <item name="tuesday" xsi:type="array">
            <item name="label" xsi:type="string" translate="true">Tuesday</item>
            <item name="value" xsi:type="string">tuesday</item>
        </item>
        <item name="wednesday" xsi:type="array">
            <item name="label" xsi:type="string" translate="true">Wednesday</item>
            <item name="value" xsi:type="string">wednesday</item>
        </item>
        <item name="thursday" xsi:type="array">
            <item name="label" xsi:type="string" translate="true">Thursday</item>
            <item name="value" xsi:type="string">thursday</item>
        </item>
        <item name="friday" xsi:type="array">
            <item name="label" xsi:type="string" translate="true">Friday</item>
            <item name="value" xsi:type="string">friday</item>
        </item>
    </item>
</item>

This is creating a fieldset with the label, but no checkboxes.

Actual output

If I change the component and elementTmpl from checkbox-set to checkbox then I see a single checkbox. According to the Magento Docs - Checkboxset Component these are the correct values for the appropriate settings.

How do I need to alter the layout.xml file to show multiple checkboxes with the name days[] so that I can select none, one or more of the checkboxes?

0

The options "name" needs to be a sequential numerical list starting at "0".

<item name="options" xsi:type="array">
    <item name="0" xsi:type="array">
        <item name="label" xsi:type="string" translate="true">Monday</item>
        <item name="value" xsi:type="string">monday</item>
    </item>
    <item name="1" xsi:type="array">
        <item name="label" xsi:type="string" translate="true">Tuesday</item>
        <item name="value" xsi:type="string">tuesday</item>
    </item>
    <item name="2" xsi:type="array">
        <item name="label" xsi:type="string" translate="true">Wednesday</item>
        <item name="value" xsi:type="string">wednesday</item>
    </item>
    <item name="3" xsi:type="array">
        <item name="label" xsi:type="string" translate="true">Thursday</item>
        <item name="value" xsi:type="string">thursday</item>
    </item>
    <item name="4" xsi:type="array">
        <item name="label" xsi:type="string" translate="true">Friday</item>
        <item name="value" xsi:type="string">friday</item>
    </item>
</item>

With text it turned it into multidimentional object not an array

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.