Get Categorized Items for Each Vendor and Display in Bootstrap

index.cfm

<cfoutput>
	
	<cfset qItems = model("User").findAll(
		where	= "vendorid IS NOT NULL",
		order	= "vendorid DESC, itemcategoryid ASC, sortorder ASC", 
		include = "item(itemcategoryjoin(itemcategory)),UsergroupJoin(usergroup)"
	)>
	
    <h3><strong>Vendors</strong></h3>
    <br />
    
    <cfset vendorIdsSet = "">    
    <cfset vendors = {}>
    
    <!--- Get Vendors --->
    <cfloop query="qItems">
    	
        <cfif !ListFindNoCase(vendorIdsSet,vendorId)>            
            <cfset vendors[vendorid] = {
				id        = vendorid,
				firstname = zx_firstname,
				lastname  = zx_lastname,
				categories=[]
			}>
            <cfset vendorIdsSet = ListAppend(vendorIdsSet,vendorId)>
        </cfif> 
        
    </cfloop>   
    
    <!--- Get Categories --->
    <cfloop list="#StructKeyList(vendors)#" index="currentVendorId">
    
    	<cfset categoryIdsSet = "">    
    	<cfset categories = {}>
        
        <cfloop query="qItems">
        
        <cfif !ListFindNoCase(categoryIdsSet,itemCategoryId) AND vendorid EQ currentVendorId>            
		<cfset categories[itemcategoryid] = {
                    id		  = itemcategoryid,
                    name	  = itemcategoryname,
                    items	  = []
                }>
                <cfset categoryIdsSet = ListAppend(categoryIdsSet,itemCategoryId)>
            </cfif>
        
        </cfloop>
        
        <cfset vendors[currentVendorId].categories = categories>
        
    </cfloop>
    
    <!--- Get Items --->
    <cfloop list="#StructKeyList(vendors)#" index="currentVendorId">
        <cfloop list="#StructKeyList(vendors[currentVendorId].categories)#" index="currentCategoryId">
        
        	<cfset itemIdsSet = "">    
    		<cfset items = {}>
            
            <cfloop query="qItems">
            
                 <cfif !ListFindNoCase(itemIdsSet,itemid) AND itemCategoryId EQ currentCategoryId AND vendorid EQ currentVendorId>            
                    <cfset items[itemid] = {
                        id	  = itemid,
                        name      = name,
			price	  = price,
			cat	  = itemcategoryname,
			vendor	  = firstname,
			unit	  = unit,
			inventory = inventory
                    }>
                    <cfset itemIdsSet = ListAppend(itemIdsSet,itemid)>
                </cfif>
            
            </cfloop>
            
            <cfset vendors[currentVendorId].categories[currentCategoryId].items = items>
        
        </cfloop>
    </cfloop>
    
    <!--- Render --->
    <cfloop list="#StructKeyList(vendors)#" index="currentVendorId">
    	<cfset vendor = vendors[currentVendorId]>
        <h5>#vendor.firstname# #vendor.lastname#</h5>
        
        <cfset uniqueTabCountStart = RandRange(1, 999)>
        
        <cfset categoryHtml = "">
        <cfset itemHtml = []>
        <cfset tabcount = uniqueTabCountStart>
        <cfset setActive = "active">
        <cfloop list="#StructKeyList(vendor.categories)#" index="currentCategoryId">
        	
			<cfset category = vendor.categories[currentCategoryId]>
            <cfset categoryHtml = categoryHtml &
              '<li class="#setActive#"><a href="##vendor-#tabcount#" data-toggle="tab">#category.name#</a></li>'>          
            
            <cfset thisItemHtml = "">
            
            <cfloop list="#StructKeyList(category.items)#" index="currentItemId">
            	<cfset item = category.items[currentItemId]>
                <cfset thisItemHtml = thisItemHtml &
             		 '<div class="col-md-3">#item.name#<br>#item.price# / #item.unit#</div>'> 
            </cfloop>
            
            <cfset arrayAppend(itemHtml,thisItemHtml)> 
            <cfset tabcount++>
            <cfset setActive = "">
        </cfloop>
        
        <ul class="nav nav-tabs"> 
        	#categoryHtml#
        </ul>
        <div class="tab-content">
        	<cfset tabcount = uniqueTabCountStart>
            <cfset setActive = "active">
            <cfloop array="#itemHtml#" index="thisItemHtml">
                <div class="tab-pane fade in #setActive#" id="vendor-#tabcount#">
                     <br class="clear" />#thisItemHtml#
                </div>      
                <cfset tabcount++>
                <cfset setActive = "">
            </cfloop> 
        </div>
        
        <br class="clear" /><br /><br />
        
    </cfloop>
    
</cfoutput>