To change tabs on hover over it and contents can be shown with out clicking to select,, contents will be hidden by default and will be shown on hovering over tabs Here we need HTML, CSS and javascript to get a tab Sample code is added below Add HTML elements to create a tab <div class=”tab”> <button class=”tablinks” onmouseover=”openCity(event,… Continue reading How to change tabs on hover with out click
Author: Abhilash Venkataramana
Proposal to add Validation for confirm checkbox before add to cart in liquid pixel item
proposal to add Validation for confirm checkbox before add to cart, Add to cart button will be made not to submit without checking checkbox when using personalisation and user should be able to add to cart when not using personalisation Requirement In PDP page for liquid pixel item, we have a confirm checkbox to check… Continue reading Proposal to add Validation for confirm checkbox before add to cart in liquid pixel item
To add pagination on each pages using bootstrap
When we have many pages in website we need to add page numbers and it should be selected based on page opened in bootstrap we can add paginations and do soTo create a basic pagination, add class name as .pagination class to an elementExample:
Check box validation and disable add to cart button when check box not checked in liquid pixel item page
We have got a requirement that to add validation message in liquid pixel item page there we have checkbox to confirm about entered details If we click add to cart without checking check box user should get validation message for this we have make use of add to cart button functionality and jQuery to display… Continue reading Check box validation and disable add to cart button when check box not checked in liquid pixel item page
How to make a button not to submit without checking checkbox and display a validation message
Using jQuery and taegeting form id, button id and checkbox id we can make a button not to submit Create required html elements with ids JQuery code is added below
To show or to hide an element by targeting id using jquery
The matched elements will be hidden immediately, with no animation. This is roughly equivalent to calling .css( “display”, “none” ) We can use if else condition in hiding and showing an element css can be used in script using jquery hide and show is triggered when condition is executed
To create a class to a existing element using jquery
When ever different changes is to be made to a single element we create class to an existing div using jquery To add a new class, we use jQuery addClass() method. The addClass() method is used to add more classes and their attributes to each selected element. It can also be used to change the property of the selected… Continue reading To create a class to a existing element using jquery
Use the “Search” Component to Set the ‘url’ property of Models
The ” Search ” component includes the ” getUrl() ” method, which can be use to get the URL of the item search API of SuiteCommerce website When getUrl() is called, it returns a string that corresponds to the end fragment of the item search URLExample: This is example for search bag Need to call this… Continue reading Use the “Search” Component to Set the ‘url’ property of Models
The ” Search ” component includes the ” getUrl() ” method, which can be use to get the URL of the item search API of SuiteCommerce website When getUrl()is called, it returns a string that corresponds to the end fragment of the item search URL Example:
var search = container.getComponent(‘Search’);var searchParams = {q: “bag”};var searchURL = search.getUrl(searchParams); This is example for search bag Need to call this method in entry point file of extensionSource: NetSuite Applications Suite – Use the Search Component to Set the ‘url’ property of Models (oracle.com)
Hide search bar when clicked on header logo in mobile view
By default in SCA websites when clicked on header logo it triggers search button when page is in home page and in mobile view For this we need to extend header logo view and need to use functionality of search button, add required device. Already in source code property is given for desktop so again… Continue reading Hide search bar when clicked on header logo in mobile view