When a customer search product in the search then they should be able to see the following criteria:
- 1) Image
- 2) Name
- 3) Sale price
- 4) Stock level (in / out of stock)
- 5) Review rating
So in order to achieve the requirement we need to create an extension Search Update for the changes we want to see in the search.
- In the entry file of the javascript we need to extend the ProductLineStockView to retrieve whether the item is in stock or not. Here we can also able to get the available quantity of the item value.
_.extend(ProductLineStockView.prototype, {
getContext: _.wrap(ProductLineStockView.prototype.getContext, function (fn) {
try {
var original = fn.apply(this, _.toArray(arguments).slice(1));
// console.log("original", original);
var quantityavailable = this.stock_info.stock;
var showInStockMessage = false;
var showOutOfStockMessage = false;
// console.log('quantityavailable', quantityavailable);
if (quantityavailable == 0) {
showInStockMessage = false;
showOutOfStockMessage = true;
}
else {
showInStockMessage = true;
showOutOfStockMessage = false;
}
original.quantityavailable = quantityavailable;
original.showInStockMessage = showInStockMessage;
original.showOutOfStockMessage = showOutOfStockMessage;
return original;
}
catch (e) {
console.log('this', e);
}
})
});
- Now we need to create a childviews to get the values of the stock information of the item and also the price of the item with ProductViewsPriceView we can able to get the price of the item and that will be stored in a childview ‘Item.Price’, ProductLineStockView will help to retrive the in/out stock of the item and it can be stored in the childview ‘Item.Stock’.
_.extend(ItemsSearcherItemView.prototype.childViews, {
childViews: _.extend(ItemsSearcherItemView.prototype.childViews, {
'Item.Price': function (options) {
return function () {
return new ProductViewsPriceView({
model: options.model
});
};
},
'Item.Stock': function (options) {
return function () {
return new ProductLineStockView({
model: options.model,
});
};
},
})
});
}
};
});
- Now with childviews created we need to add those data-view to the corresponding template of the theme where we need to display the values in the website.
<div data-view="Item.Stock"></div>
<div data-view="Item.Price"></div>
- After the above steps deploy the extensions and activate it and see the website we will be getting the data-view working but the values won’t coming and instead it will show the default message.

- Therefore we need to pass the values(Variables) created in the netsuite. So for that navigate to Commerce –> Websites –> Website List now click edit to the website we want to add the functionality. Here we go to the Field Sets and in the field we have to add the fields mentioned below
- i) onlinecustomerprice_detail: Price for Current Customer (Detail)
- ii) outofstockmessage: Out Of Stock Message
- iii) isinstock: In Stock
- iv) outofstockbehavior: Out Of Stock Behavior
- v)showoutofstockmessage: Display Out-of-Stock Message
- vi) quantityavailable: Available
- vii) ispurchasable: Available for Purchase.

- After adding the fields click save and do catche invalidation request now goto the the website and search the item in the global search and you will be able to see the Image,Name, Price, In/Out of stock and Review rating of the item.
