1. WooCommerce Quick View Pro
  2. Developer Documentation

Javascript API

This article documents the Javascript API for WooCommerce Quick View Pro. This article is aimed at developers.

window.WCQuickViewPro

The window.WCQuickViewPro object provides the following functions:

initialize

Binds the events for the Quick View on the current page.

openQuickView

Opens a Quick View modal for a given product.

Arguments
int productId – The product ID (required)
Element trigger – The DOM element that triggered the quick view action (optional)

handleQuickViewClick

An event handler which can be used to open a Quick View modal (e.g. when an element is clicked). The element that triggers the event should have a product_id data attribute defined. E.g.

<a href="#" data-product_id="234">Open Quick View</a>

Events

quick_view_pro:open

This is triggered each time a quick view is opened for a product. Event data:

  • modal - the modal object (see below)

quick_view_pro:load

This is triggered the first time the quick view is loaded for a product. Subsequent calls to the same product will only trigger the quick_view_pro:open event as the product data is only loaded once. Event data:

  • modal - the modal object (see below)

quick_view_pro:close

This is triggered each time the quick view is closed. Event data:

  • modal - the modal object (see below)

quick_view_pro:added_to_cart

This is triggered each time a product is added to the cart from the quick view. Event data:

  • response - the cart response object. This contains the following properties:
    • cart_message - The cart success message. This will only be present if the product was added successfully.
    • error - The error message if adding to the cart has failed.
    • fragments - The cart "fragments" used by WooCommerce. Usually just contains the mini-cart widget.
    • cart_hash - An encoded hash of the cart. This is used by WooCommerce when triggering cart events.
  • modal - the modal object (see below)

The modal object

The modal object passed to each of the Javascript events is the modal object from the jQuery Modal library which is used in Quick View Pro. It contains one main property - $elm - which is a jQuery object for the modal <div> element.

Related Articles

If searching the knowledge base hasn't answered your question, please contact support.