How to display quantity pricing as a table, dropdown & quantity box according to individual items in the pdp page

To display quantity pricing as of table and dropdown, we have to first create a field and passing those values through Netsuite. Then need to create sub filed value for eg: (Normal quantity pricing & Enhnaced quantity Pricing). We have create a var in the proper view for getting the values there as True/ false. According to it we will make conditions.

For displaying the quantity pricing table and dropdown for item, first we need to create a field and that field values we have to pass through Netsuite. After that for create a var assigning that field value under the get context fn.

For eg: this is the fn for displaying the enhance quantity and normal quantity. Microsite soln is the field

'EnhancedQuantityPricing': function EnhancedQuantityPricing() {
                        var self = this;
            
                        var item = this.line.get('item');
            
                        if (Configuration.get('micrositeSolution') && Configuration.get('micrositeSolution').sitePriceLevel) {
            
                            if (item.get('custitem_tag_enhc_qty_pricing') && item.get('internalid') && Configuration.get('micrositeSolution').sitePriceLevel) {
            
                                quantityFromModel = this.model.get('quantity');
                                _.each(pricingSchedule, function eachScheduled(schedule) {

                                    if (schedule.maximumquantity && schedule.maximumquantity <= 50000) {
                                        var quantity = parseInt(schedule.maximumquantity);
        
                                        var price = quantity * (pricingSchedule[counter + 1].price * 1000);
                                        price = price / 1000;
        
                                        var newPrice = parseFloat(price).toFixed(2);
                                        var formattedPrice = "$" + newPrice;
        
        
                                        var formattedQuantity = quantity.toFixed(2).replace(/(\d)(?=(\d{3})+\.)/g, '$1,');
                                        var dot = formattedQuantity.indexOf('.');
                                        formattedQuantity = formattedQuantity.substring(0, dot);
        
                                        var customName = formattedQuantity + '- ' + formattedPrice;
                                        if (quantityFromModel > 0) {
                                            if (quantityFromModel == quantity) {
                                                quantities.push({ name: customName, value: quantity, selected: true });
                                            } else {
                                                quantities.push({ name: customName, value: quantity, selected: '' });
                                            }
                                        } else {
                                            quantities.push({ name: customName, value: quantity, selected: '' });
                                        }
                                    }
                                    counter++;
                                });
        
                                context.quantities = quantities;
                                //console.log("quantities", quantities);
                                var cart = LiveOrderModel.getInstance().on('change', this.render, this);
                                console.log("cart", cart)
                                _.each(context.priceSchedule, function (priceScheduleval) {
        
                                    priceScheduleval.maximumquantity = priceScheduleval.maximumquantity + 1;
                                    // priceScheduleval.maximumquantity=
                                    var finalval = (priceScheduleval.maximumquantity) * (priceScheduleval.price);
                                    priceScheduleval.price = parseFloat(finalval).toFixed(2);
                                    priceScheduleval.price_formatted = "$" + (priceScheduleval.price);
        
                                });
            
                                return new QuantityPricingEnhanceView ({
                                    model: item,
                                    priceSchedule:quantityPricingModel,
                                    application:self.application
                                });
                            }
                        }
                    },
            
                    'NormalQuantityPricing': function NormalQuantityPricing() {
                        var self = this;
            
                        var item = this.line.get('item');
            
                        if (Configuration.get('micrositeSolution') && Configuration.get('micrositeSolution').sitePriceLevel) {
            
                            if (item.get('internalid') && Configuration.get('micrositeSolution').sitePriceLevel) {
            
                                var quantityPricingModel = new QuantityPricingModel();
                                quantityPricingModel.fetch({
                                    data: {
                                        requestType:'single',
                                        itemId:item.get('internalid'),
                                        itemType:item.get('itemtype'),
                                        priceLevel:Configuration.get('micrositeSolution').sitePriceLevel
                                    }
                                });
            
                                return new QuantityPricingNormalView ({
                                    model: quantityPricingModel,
                                    application:self.application
                                });
                            }
                        }
                    }

According to view we have to add the var and functions.
 originalRet.showQuantity = this.model.get(‘item’).get(‘custitem_tag_qty_pricing’)
This is used to show whether the field value is true/ False. According to it Dropdown/Table will show.

Then have to write conditions in tpl file.

{{#if showQunatityPricing}}
							<div data-view="Quantity.Pricing"></div>
							{{#if showQuantity}}
							<div data-view="Quantity"></div>
							{{/if}}
							{{else}}
							<div data-view="Quantity"></div>
							{{/if}}

Leave a comment

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