Skip to content

Load Variant Data On Variant Change#


Description#

This first block of code is JS that would call a new page you create which contains the second block of code. The second section looks up the variant product and builds a JSON object to return back to the page.

MivaEvents.SubscribeToEvent("variant_changed", function (product_data) {
    var master_code = product_data.product_code;
    var variant_id = product_data.variant_id;
    var url = "/load-variant-data.html?product_code=" + master_code + "&variant_id=" + variant_id;

    $.get(url, function (data) {
        //Data Bindings
        var obj = JSON.parse(data);

        $("#product_code").html(obj.sku);
        $("#product_name").html(obj.name);
    });
});
<mvt:if expr="NOT ISNULL g.product_code AND NOT ISNULL g.variant_id">

    <mvt:do file="g.Module_Library_DB" name="l.success" value="Product_Load_Code(g.product_code, l.product)" />

    <mvt:do file="g.Module_Library_DB" name="l.success" value="ProductList_Load_Variant(l.product:id, g.variant_id, l.productvariants)" />

    <mvt:comment>Load Variant Product To Get Description</mvt:comment>
    <mvt:do file="g.Module_Library_DB" name="l.success" value="Product_Load_Code(l.productvariants[1]:code, l.product)" />
    <mvt:assign name="l.productvariants[1]:descrip" value="l.product:descrip" />

    <mvt:assign name="l.settings:variant" value="l.productvariants[1]" />
        {
            "sku": "&mvtj:variant:sku;",
            "code": "&mvtj:variant:code;",
            "name": "&mvtj:variant:name",
            "weight": "&mvtj:variant:weight",
            "description": "&mvtj:variant:descrip",
            <mvt:item name="customfields" param="Read_Product_Code(l.settings:variant:code,'')" />

            <mvt:assign name="g.custom_field_count" value="miva_array_elements( l.settings:customfields )" />
            <mvt:foreach iterator="custom_field" array="customfields">
                "&mvte:custom_field:code;": "&mvtj:custom_field:value;" <mvt:if expr="pos1 LT g.custom_field_count">,</mvt:if>
            </mvt:foreach>
        }

</mvt:if>

Functions Used#

  • Product_Load_Code
  • ProductList_Load_Variant
  • miva_array_elements