Add Custom Field in Checkout

Adding a custom field in the checkout section which reflects in the SO

Entry Point : 

define(
	'CD.CheckoutCheckboxes.CheckoutCheckboxes'
,   [
		'CD.CheckoutCheckboxes.CheckoutCheckboxes.View'
	]
,   function (
		CheckoutCheckboxesView
	)
{
	'use strict';

	return  {
		mountToApp: function mountToApp (container)
		{
			// using the 'Layout' component we add a new child view inside the 'Header' existing view 
			// (there will be a DOM element with the HTML attribute data-view="Header.Logo")
			// more documentation of the Extensibility API in
			// https://system.netsuite.com/help/helpcenter/en_US/APIs/SuiteCommerce/Extensibility/Frontend/index.html
			
			/** @type {LayoutComponent} */
            var checkout = container.getComponent("Checkout");

            if (checkout) {
                checkout.addModuleToStep({
                    step_url: "review",
                    module: {
                        id: "CheckoutCheckboxesView",
                        index: 1,
                        classname: "CD.CheckoutCheckboxes.CheckoutCheckboxes.View",

                    },
                });
            }

		}
	};
});

View:

// @module CD.CheckoutCheckboxes.CheckoutCheckboxes
define('CD.CheckoutCheckboxes.CheckoutCheckboxes.View', [
    'cd_checkoutcheckboxes_checkoutcheckboxes.tpl', 'Backbone', "Wizard.Module", 'LiveOrder.Model', 'AddItemsToList.Model'
], function(
    cd_checkoutcheckboxes_checkoutcheckboxes_tpl, Backbone, WizardModule, LiveOrderModel, AddItemsToListModel
) {
    'use strict';

    // @class CD.CheckoutCheckboxes.CheckoutCheckboxes.View @extends Backbone.View
    return WizardModule.extend({

        template: cd_checkoutcheckboxes_checkoutcheckboxes_tpl
            //@method getContext @return CD.CheckoutCheckboxes.CheckoutCheckboxes.View.Context
           
        getContext: function() {

            return {
                ischecked: this.model.attributes.options.custbody4 == "T" ? true : false,
                isReview: this.step.step_url == 'review'
            }
        }
    });
});

Template: 
<div id="checkoutcheckboxes" class="checkoutcheckboxes-container">
    {{#if isReview}}
    <div class="checkoutcheckbox">
        <input type="checkbox" id="checkbox_gift_order" name="custbody4" {{#if ischecked}} checked {{/if}}>
        <label> This is a gift order</label><br>
    </div>
    {{/if}}
</div>

Leave a comment

Your email address will not be published. Required fields are marked *