Add Note field in Quote Checkout

We can add a section for the “Add Note” field to the checkout page of the quote, allowing users to add any message, which will be saved in a common transaction body field that is available on both the sales order and quote records.

To implement this, follow these steps:

  1. Create a custom transaction body field that is available on both the quote and sales order.
  2. Create an extension to modify the template of the OrderWizardModulePaymentMethodSelector view.
  3. Add the “Add Note” field section with a data-action attribute to retrieve the value entered in the field.
  4. Upon entering a value in the field, capture the value and the ID of the quote, and then pass it to the backend.
  5. In the backend, load the quote record and save the value in the corresponding note field on the quote.
  6. When the customer clicks the “Place Order” button, the note field will automatically populate on the sales order, similar to how other fields are populated.
 
                _.extend(OrderWizardModulePaymentMethodSelector.prototype, {
                    template: jj_addnoteinquote_addnoteinquote_tpl,
                    events: _.extend(OrderWizardModulePaymentMethodSelector.prototype.events, {
                        'change [data-action="track-input"]': 'TrackInput'
                    }),
                    TrackInput: function TrackInput() {
                        var noteOnQuote;
                        var self = this;
                        var options = self.model.get('options');
                        noteOnQuote = $('.pobutton').val(); 
                        options.custbody_memo = noteOnQuote;
                        self.model.set('options', options);
                        var quoteid = this.model.get('quoteid');
                        var model = new AddNoteInQuoteModel();
                        return model.fetch({
                            data: {
                                quoteId: quoteid,
                                note: noteOnQuote
                            }
                        }).done(function (result) {
                            console.log(result);
                        });
                    }
                });

<div class="order-wizard-paymentmethod-selector-module"><h2 class="order-wizard-paymentmethod-selector-module-header"> 
</h2><h3>Add Note Section</h3>
  <form>
    <div class="row porow">
		<br>	
    <textarea class="pobutton" data-action="track-input" data-validation="control" maxlength=""></textarea>
    </div>
  </form>
</div>

  quoteUpdate: function (quoteId, noteValue) {
                try {
                    var quoteId = quoteId;
                    var noteValue = noteValue;
                    var result = null;
                    console.error('quoteId quoteId', quoteId);
                    console.error('noteValue noteValue', noteValue);
                    if(!!noteValue){
                    var record = nlapiLoadRecord('estimate', quoteId);
                    record.setFieldValue('custbody_memo', noteValue);
                    result = nlapiSubmitRecord(record);
                    }
                    return result;
                } catch (e) {
                    console.error('error at model', e);
                }
            }

Leave a comment

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