2016-11-24 32 views
0

我们创建了一个电子商务项目,在点击UI中的类别时,它将呈现给该页面中的类别页面,该页面显示了每个子类别的一个产品如何在mongodb和node.js中显示数据库中的单个项目

我写的代码在整个产品的具体类别名称显示我怎么可以删除多余的产品,截至目前我所需要的特定类别的每个子类中只有一个产品

the routing code is 


    router.get("/shop/:category_name", function(req, res){ 
//querystring 
var url = require('url'); 
var url_parts = url.parse(req.url, true); 
var query = url_parts.query; 

var viewModel = { 
breadCrumb: [], 
categories : [], 
featuredProducts :[], 
products : [], 
}; 

viewModel.breadCrumb.push({ 
     name : 'Home', 
     class : 'breadcrumb-ordinary' 
    }); 
    viewModel.breadCrumb.push({ 
     name : req.params.category_name, 
     class : 'breadcrumb-active' 
    }); 

async.parallel({ 

    categories: function(cb){ 
    Category.find({}, cb); 
    }, 

    categories1:function(cb){ 
    Category.find({category_name:req.params.category_name}, cb); 
    } 

}, function(err, results) { 

    if (err) throw err; 
    viewModel.categories1=results.categories1; 
    viewModel.categories=results.categories; 
    res.render('shop/prod_grid',viewModel); 

    }); 

}); 

视图UI代码是

<!doctype html> 
<html lang="en-US"> <!--<![endif]--> 
<head> 
</head> 
<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet"> 
<link rel="stylesheet" href="../../../shop-plugins/css/jplist-pagination.css"> 
<link rel="stylesheet" href="../../../shop-plugins/css/breadcrumb.css"> 
    <body>    

{{> shop/header}} 
<!-- BAR --> 
<div class="shipping-wrap"> 
    <div class="container"> 
     <div class="row"> 
      <div class="span12"> 
       <ul> 
        <li> 
         {{#each breadCrumb}} 
         {{#if @first}} 
         <a href="/" class="{{class}}">{{name}}&nbsp; 
         {{else}} 
         <a class="{{class}}">{{name}}&nbsp; 
         {{/if}} 

         {{#if @last}} 
          {{else}} 
          <i class="fa fa-angle-double-right"></i></a> 
         {{/if}} 
        {{/each}} 

        </li> 
       </ul> 
      </div> 
     </div> 
    </div> 
</div> 

<!-- BAR --> 
<!-- PRODUCT-OFFER --> 
<div class="product_wrap"> 
<div class="container"> 
    <div class="row"> 
     <div id="span9" class="span9 product-grid"> 
      <div id="products" class="box jplist jplist-grid-view"> 
       <div class="jplist-panel box jplist-panel-top"> 
        <div 
         class="jplist-drop-down" 
         data-control-type="items-per-page-drop-down" 
         data-control-name="paging" 
         data-control-action="paging"> 
         <ul id="per-pages"> 
          <li><span data-number="3">3 per page</span></li> 
          <li><span data-number="6" data-default="true">6 per page</span></li> 
          <li><span data-number="9">9 per page</span></li> 
          <li><span data-number="12">12 per page</span></li> 
         </ul> 
        </div> 
        <div 
         class="jplist-drop-down" 
         data-control-type="sort-drop-down" 
         data-control-name="sort" 
         data-control-action="sort"> 
         <ul id="sorting"> 
          <li><span data-path="default">Sort By</span></li> 
          <li><span data-path=".brand" data-order="asc" data-type="text">Brand A-Z</span></li> 
          <li><span data-path=".brand" data-order="desc" data-type="text">Brand Z-A</span></li> 
          <li><span data-path=".cost" data-order="asc" data-type="number">Cost Low-High</span></li> 
          <li><span data-path=".cost" data-order="desc" data-type="number">Cost High-Low</span></li> 
         </ul> 
        </div> 
        <div 
         class="jplist-label" 
         data-type="Page {current} of {pages}" 
         data-control-type="pagination-info" 
         data-control-name="paging" 
         data-control-action="paging"> 
        </div> 
        <div 
         class="jplist-views" 
         data-control-type="views" 
         data-control-name="views" 
         data-control-action="views" 
         data-default="jplist-grid-view"> 
        </div> 
       </div> 

          {{#each subcategoryprod}}  

          <div> 
           <ul> 

             <li><a href="/prod_grid?cat={{../category_name}}&subcat={{subcategory}}">{{subcategory}}</a></li> 

           </ul> 
          </div> 

{{/each}} 


<!--category wise products--> 
           <div id="jp-panel" class="list box text_shadow"> 

             {{#each subcategoryprod}} 

              <div id="jp-panel-item" class="list-item box"> 
               <div class="span3 product"> 

                <div> 
                 <figure> 
                  {{#each image}} 
                   {{#if @first}} 
                    <a href="#"><img src="../../../uploads/products/{{../_id}}/{{img}}" alt="" onerror="this.src='../../../shop-images/coming-soon.png'"></a> 
                    <div class="overlay"> 
                     <a href="../../../uploads/products/{{../_id}}/{{img}}" class="zoom" width="1200" height="1200"></a> 
                     <a href="/prod_grid/{{../product_name}}/{{../product_no}}?cat={{../category}}&subcat={{../subcategory}}&tags={{../tags}}&brand={{../brand}}" class="link"></a> 

                    </div> 
                   {{/if}} 
                   {{else}} 
                    <a href="#"><img src="../../../shop-images/coming-soon.png" alt=""></a> 
                    <div class="overlay"> 
                     <a href="../../../shop-images/coming-soon.png" class="zoom" height="1200" width="1200"></a> 
                     <a href="/prod_grid/{{product_name}}/{{product_no}}?cat={{category}}&subcat={{subcategory}}&tags={{tags}}&brand={{brand}}" class="link"></a> 

                    </div> 
                  {{/each}} 
                 </figure> 
                 <div class="detail"> 
                  <span name="retailprice" class="cost">₹{{RetailPrice}}</span> 
                  <span>{{colour}}</span> 
                  <h4 class="brand">{{brand}}</h4> 
                  <span>{{Description}}</span> 
                  <div class="icon"> 
                   <a href="/shop/shopping-cart/{{product_no}}" class="one tooltip" title="Add to cart"></a> 
                   <a href="/product-grid" class="two tooltip " title="Add to wishlist"></a> 
                  </div> 
                 </div> 
                </div> 

               </div> 
              </div> 
            {{/each}} 

             </div> 








       <div class="box jplist-no-results text-shadow align-center"> 
        <p> No results Found</p> 
       </div> 
       <div class="jplist-panel box panel-bottom"> 
        <div 
         class="jplist-label" 
         data-type="{start} - {end} of {all}" 
         data-control-type="pagination-info" 
         data-control-name="paging" 
         data-control-action="paging"> 
        </div> 
        <div 
         class="jplist-pagination back-top" 
         data-control-animate-to-top="true" 
         data-control-type="pagination" 
         data-control-name="paging" 
         data-control-action="paging"> 
        </div> 
       </div> 
      </div> 
     </div> 
     <div class="span3"> 
      <div class="row">&nbsp; 
      </div> 
      <div id="sidebar"> 
       <div class="widget"> 
        <h4>Price Filter</h4> 
        <div class="price-range"> 
         <div id="slider-range"></div> 
         <p class="clearfix"> 
         <input type="text" id="amount" readonly /> 
         <input type="text" id="amount2" readonly /> 
         </p> 
        </div> 
       </div> 
       <div class="widget"> 
        <h4>BRANDS</h4> 
        <div id=""> 
         <div class="brands"> 
          <input type='text' id='txtList' onkeyup="searchBrand(this)" placeholder="search brands here....." /> 
           <!-- <ul id="fromList" class="myid"> --> 
            {{#each products}} 
             <ul id="fromList" class="myid"> 
              <li>&nbsp;&nbsp;<input type="checkbox" id="{{brand}}" class="brandFilterCheckBox pull-right" align="center"/>&nbsp;&nbsp;<label for="{{brand}}">{{brand}}<label></li> 
             </ul> 
            {{/each}} 
           <!-- </ul> --> 
         </div> 
        </div> 
       </div> 
      </div> 
       <div class="widget"> 
        <h4>CATEGORIES</h4> 
        <div id="accordion"> 
         {{#each categories}} 
          <h5><a href="#">{{category_name }}</a></h5> 
          <div> 
           <ul> 
            {{#each subcategories1}} 
             <li><a href="/prod_grid?cat={{../category_name}}&subcat={{subcategory_name}}">{{subcategory_name}}</a></li> 
            {{/each}} 
           </ul> 
          </div> 
         {{/each}} 
        </div> 
       </div> 

     </div> 
    </div> 
</div> 
</div> 
    <!-- Featured Products --> 
     <div class="container" style="margin-top:10px"> 
        <div class="row heading-wrap"> 
         <div class="span12 heading"> 
          <h2>Featured Products <span></span></h2> 
         </div> 
        </div> 
        <div class="row similar_products"> 
         <div id="feat_prod">         
         {{#each featuredProducts}} 
          <div class="span3 product"> 
            <figure> 
             {{#each image}} 
              {{#if @first}} 
               <a href="#"><img src="../../../uploads/products/{{../_id}}/{{img}}" alt=""></a> 
               <div class="overlay"> 
                <a href="../../../uploads/products/{{../_id}}/{{img}}" class="zoom prettyPhoto"></a> 
                <a href="/prod_grid/{{../product_name}}/{{../product_no}}?cat={{../category}}&subcat={{../subcategory}}&tags={{../tags}}&brand={{../brand}}" class="link"></a> 
               </div> 
               {{/if}} 
             {{/each}} 

            </figure> 
            <div class="detail"> 
             <span>₹{{RetailPrice}}</span> 
             <h4>{{product_name}}</h4> 
             <span>{{Description}}</span> 
            </div> 
           </div> 
         {{/each}} 
         </div> 
         </div> 
        </div> 

    <!-- PRODUCT-OFFER --> 
    <!-- FOOTER --> 
    {{> shop/footer}} 
      <script type="text/javascript" src="../../../shop-plugins/js/jplist-pagination.js"></script> 
      <script src="../../../bootstrap/js/star.min.js"></script> 
<script src="../../../shop-plugins/js/jquery.paginate.js"> </script>     
    <script> 
     $(function(){ 
      $('#feat_prod').paginate(); 
     }); 
    </script>  


    <script> 

    $(document).ready(function(){ 
      $('#products').jplist({ 
      itemsBox: '.list' 
      ,itemPath: '.list-item' 
      ,panelPath: '.jplist-panel' 

     });   
    }); 

</script> 


    <script> 
    $('document').ready(function(){ 
     $("#slider-range").slider({change : function(event,ui){ 
     var lowerLimit=$("#amount").val(); 
      var numberLowerLimit=Number(lowerLimit.substring(1,lowerLimit.length)); 
      var upperLimit=$("#amount2").val(); 
      upperLimit=upperLimit.substring(1,upperLimit.length); 
      var numberUpperLimit=Number(upperLimit.replace("₹","")); 
      console.log("LOWER LIMIT :"+lowerLimit+" UPPER LIMIT :"+upperLimit); 
      $(".cost").each(function(){ 
       var rowUnitCost=$(this).text(); 
       var unitCost=Number(rowUnitCost.substring(1,rowUnitCost.length)); 
       if(unitCost<numberLowerLimit || unitCost>numberUpperLimit){ 
        var hiddingBox=$(this).parents(".list-item"); 
        /*hiddingBox.removeClass("list-item").addClass("rafsal-test");*/ 
        hiddingBox.hide(); 
        console.log("Values IN:"+unitCost); 
       } 
       else{ 
        var hiddingBox=$(this).parents(".list-item"); 
        if(hiddingBox.attr('id')==undefined || hiddingBox.attr('id')=="undefined"){ 
         hiddingBox=$(this).parents(".rafsal-test"); 
         hiddingBox.addClass("list-item").removeClass("rafsal-test"); 
        } 
        hiddingBox.show(); 
        console.log("Values OUT:"+unitCost); 
       } 
       $('#products').jplist({ 
        itemsBox: '.list' , 
        itemPath: '.list-item' , 
        panelPath: '.jplist-panel' 

       }); 

      }); 
     } 
    }); 

    // Brand Filter 
    $(".brandFilterCheckBox").on('click',function(){ 
     $(".brand").each(function(){ 
      var hiddingBox=$(this).parents(".list-item"); 
      hiddingBox.removeClass("list-item").addClass("rafsal-test"); 
      hiddingBox.hide(); 
     }); 
     $(".brandFilterCheckBox").each(function(){ 
      if($(this).prop("checked")){ 
       var filterBrand=$(this).attr("id"); 
       $(".brand").each(function(){ 
        var unitBrandName=$(this).text().trim(); 

        if(unitBrandName== filterBrand){ 
         console.log(unitBrandName); 
         var hiddingBox=$(this).parents(".list-item"); 
         if(hiddingBox.attr('id')==undefined || hiddingBox.attr('id')=="undefined"){ 
          hiddingBox=$(this).parents(".rafsal-test"); 
          hiddingBox.addClass("list-item").removeClass("rafsal-test"); 
         } 
         hiddingBox.show(); 
        } 

       }); 
       $('#products').jplist({ 
        itemsBox: '.list' , 
        itemPath: '.list-item' , 
        panelPath: '.jplist-panel' 

       }); 
      } 
     }); 

    }) 
    var textCheck="##"; 
    removeDuplicateBrands() 
    }); 
function removeDuplicateBrands(){ 
    var textCheck="##"; 
    $(".brandFilterCheckBox").each(function(){ 
     $(this).attr('id'); 
     if(textCheck.indexOf("##"+$(this).attr('id')+"##")==(-1)){ 
      textCheck=textCheck+$(this).attr('id')+"##"; 

     } 
     else{ 
      $(this).parent("li").hide(); 

     } 
    }); 
} 
</script> 
<script> 
function searchBrand(element) { 
var value = $(element).val(); 
$("#fromList li").each(function() { 
    if ($(this).text().search(value) > -1) { 
     $(this).show(); 
     $(this).prevAll('.header').first().show(); 
    } else { 
     $(this).hide(); 
    } 
}); 
removeDuplicateBrands(); 
} 

</script> 

    </body> 

,所以我张贴的照片中,我的输出是有它包含指定类别的所有产品我只需要一个产品从指定类别的每个子类和图像包含四个产品保护类和两个子类别空气freshners和主管单位,空气freshners包含三个产品,我需要只显示一个从airfreshner和一个从头部单元中,我们需要enter image description here

+0

遍历结果使用循环,只有一个产品在新的数组数据推 – AJS

回答

0

在你的路由器代码,编辑本段

categories1:function(cb){ 
    Category.find({category_name:req.params.category_name}, cb); 
    } 

更改上面的这个

categories1:function(cb){ 
    Category.findOne({category_name:req.params.category_name}, cb); 
    } 

这应该为您解决。

+0

感谢您的答复我尝试了设定,但没有工作 u能告诉我ANA诺特尔方式 –

+1

我已编辑代码 subcategoryprod:function(cb){Product.find({category_name:req.params.category_name},cb); }; 与此唯一产品显示 –

相关问题