Create a Drop-down List from an IQA

Recently I had a request to generate a drop-down list with a "continue" button; when someone selected something from the drop-down and clicked the button, it "went somewhere". (Lots of requests start out like this). The example below shows how to create a drop down from an IQA. The IQA in this case is a simple one pulling active web-enabled products from csProduct, and then linking to the default "ItemDetail" page.

<script>
    jQuery("#ste_container_ciProductsIQA").parent().hide();

    jQuery("#showOutput").html("");

    var r = jQuery("#ste_container_ciProductsIQA table tbody tr");
    var ar = [];

    var vals = {
        0: "ProductCode",
        1: "Title",
        2: "Category"
    }

    jQuery.each(r, function(key, value) {
        var l = jQuery(value).find("td");
        var i = l.length;
        var event = {};
        for (i = 0; i < l.length; i++) { 
            var a = jQuery(l[i]).html(); 
            var s = vals[i];
            event[s] = a;
        }
        ar.push(event);
    });

    var divOuter = document.createElement("div");
    var select = document.createElement("select");
    select.id = "pickProduct";
    select.appendChild(new Option("",""));

    for (i = 0; i < ar.length; i++) {
        var p = ar[i];
        var u = "/imistour12/ItemDetail?iProductCode="+p["ProductCode"]+"&Category;="+p["Category"];
        select.appendChild(new Option(p["Title"], u));
    }

    jQuery(jQuery("#showOutput")).append(select);

    jQuery("#prdContinue").click(function(){
        var i = jQuery("#pickProduct").val();
        if (i != "") {
            var l = i.toLowerCase();	
            location.href = i;
        }
    });
</script>


back
Categories
2459 Bridge Road
Oakville, ON
L6L 2G9
Canada
jake@k2andyou.com
support@k2andyou.zendesk.com
Office: (905) 901-3625
Mobile: (289) 795-3538