单击boostrap选项卡中的视图详细信息按钮时,项目显示页面无法正常工作

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (1)
  • 关注 (0)
  • 查看 (61)

我正面临着显示产品详细信息页面的问题。我有四个boostrap选项卡,在这些选项卡中有一些带有快速查看的产品项目 “链接Button.Every产品应该在点击链接按钮时显示正确的唯一ID。但是它没有按照我的预期工作。我正在使用foreach循环并且为每个产品传递产品ID,当发生点击事件时,显示具有相同id的所有四个标签项。它应该只显示一个项目。

我已经尝试了很多不同的解决方案。我应该如何处理foreach循环和Id。任何帮助都会有很大的帮助。以下是有关我的应用程序的更多详细信息

<!--This is my Single.cshtml page-->
@foreach (var item in Model.ProductList)
        {
            <div class="col-md-4 single-right-left ">

                <div class="grid images_3_of_2">

                    <div class="flexslider">


                        <ul class="slides">

                            <li data-thumb="@Html.DisplayFor(modelItem => item.ImageaFront)">
                                <div class="thumb-image"> <img src="@Html.DisplayFor(modelItem => item.ImageaFront)" data-imagezoom="true" class="img-responsive"> </div>
                            </li>
                            <li data-thumb="@Html.DisplayFor(modelItem => item.ImageBack)">
                                <div class="thumb-image"> <img src="@Html.DisplayFor(modelItem => item.ImageBack)" data-imagezoom="true" class="img-responsive"> </div>
                            </li>
                            <li data-thumb="@Html.DisplayFor(modelItem => item.ImageBack)">
                                <div class="thumb-image"> <img src="@Html.DisplayFor(modelItem => item.ImageBack)" data-imagezoom="true" class="img-responsive"> </div>
                            </li>
                        </ul>

                    </div>

                </div>
                }
                </div>
                @foreach (var item in Model.womanProductList)
        {
            <div class="col-md-4 single-right-left ">

                <div class="grid images_3_of_2">

                    <div class="flexslider">


                        <ul class="slides">

                            <li data-thumb="@Html.DisplayFor(modelItem => item.ImageaFront)">
                                <div class="thumb-image"> <img src="@Html.DisplayFor(modelItem => item.ImageaFront)" data-imagezoom="true" class="img-responsive"> </div>
                            </li>
                            <li data-thumb="@Html.DisplayFor(modelItem => item.ImageBack)">
                                <div class="thumb-image"> <img src="@Html.DisplayFor(modelItem => item.ImageBack)" data-imagezoom="true" class="img-responsive"> </div>
                            </li>
                            <li data-thumb="@Html.DisplayFor(modelItem => item.ImageBack)">
                                <div class="thumb-image"> <img src="@Html.DisplayFor(modelItem => item.ImageBack)" data-imagezoom="true" class="img-responsive"> </div>
                            </li>
                        </ul>

                    </div>

                </div>
            </div>
            
            }
        </div>
        <!--another two are same like above-->
                
                
<!--This is my Index.cshtml page..I just pass here Productid-->
<div class="tab1">
                   
                    @foreach (var item in Model.ProductList)
                    {
                        <div class="col-md-3 product-men">
                            <div class="men-pro-item simpleCart_shelfItem">
                                <div class="men-thumb-item">
                                    <img src="@Html.DisplayFor(modelItem => item.ImageaFront)" alt="" class="pro-image-front">
                                    <img src="@Html.DisplayFor(modelItem => item.ImageBack)" alt="" class="pro-image-back">
                                    <div class="men-cart-pro">
                                        <div class="inner-men-cart-pro">
                                            <a asp-page="/single" asp-route-id="@item.ProductID?tab1" class="link-product-add-cart">Quick View</a>
                                             

                                        </div>
                                    </div>
                                    <span class="product-new-top">New</span>

                                </div>
                                <div class="item-info-product ">
                                    <h4><a href="single.html">@Html.DisplayFor(modelItem => item.ProductName)</a></h4>
                                    <div class="info-product-price">
                                        <span class="item_price">$@Html.DisplayFor(modelItem => item.OriginalPrice)</span>
                                        <del>$@Html.DisplayFor(modelItem => item.FalsePrice)</del>
                                    </div>
                                    <div class="snipcart-details top_brand_home_details item_add single-item hvr-outline-out button2">
                                        <form action="#" method="post">
                                            <fieldset>
                                                <input type="hidden" name="cmd" value="_cart" />
                                                <input type="hidden" name="add" value="1" />
                                                <input type="hidden" name="business" value=" " />
                                                <input type="hidden" name="item_name" value="Formal Blue Shirt" />
                                                <input type="hidden" name="amount" value="30.99" />
                                                <input type="hidden" name="discount_amount" value="1.00" />
                                                <input type="hidden" name="currency_code" value="USD" />
                                                <input type="hidden" name="return" value=" " />
                                                <input type="hidden" name="cancel_return" value=" " />
                                                <input type="submit" name="submit" value="Add to cart" class="button" />
                                            </fieldset>
                                        </form>
                                    </div>

                                </div>
                            </div>
                        </div>
                    }
                </div>
  <!--another three tabs are same like above with diferent list-->
  
  
  <!--This is my code behind file -->
  using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using EliteShopping.Models;
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using RazorPagesDemo.Models;

namespace EliteShopping.Pages
{
    public class singleModel : PageModel
    {
       
        DatabaseContext _Context;
        public singleModel(DatabaseContext databasecontext)
        {
            _Context = databasecontext;
        }

        
        public List<Product> ProductList { get; set; }
        public List<woman> womanProductList { get; set; }
        public List<Footwere> FootwereList { get; set; }
        public List<Bag> BagList { get; set; }



        public void OnGet(int? id)
        {

            
           
           
            //for Men

            var men = (from ProductList in _Context.ProductTB
                       where ProductList.ProductID == id
                         select ProductList).ToList();

            ProductList = men;

           // for Bag

            var data2 = (from BagList in _Context.BagsTB
                         where BagList.ProductID == id
                         select BagList).ToList();

            BagList = data2;

           // for women

            var women = (from womanProductList in _Context.womanTB
                         where womanProductList.ProductID == id
                       select womanProductList).ToList();

            womanProductList = women;

            //for Footwere

            var Footwere = (from FootwereList in _Context.FootwereTB
                            where FootwereList.ProductID == id
                         select FootwereList).ToList();

            FootwereList = Footwere;

        }
    }
}

  • 它是Asp.net核心2.0 Razor页面应用程序。
  • 页面连接到数据库,都是dinamic。
提问于
用户回答回答于

index页面中,Quick View链接未将正确的产品ID传递给single页面,您应该传递id / tab名称,如:

<a asp-page="/single" asp-route-id="@item.ProductID" asp-route-tab="tab1" class="link-product-add-cart">Quick View</a>

然后在单页中,得到如下的参数:

 public void OnGet(int id,string tab)

所属标签

可能回答问题的人

  • 人生的旅途

    10 粉丝484 提问5 回答
  • 无聊至极

    4 粉丝504 提问5 回答
  • 嗨喽你好

    7 粉丝480 提问4 回答
  • 御姐万岁

    6 粉丝507 提问3 回答

扫码关注云+社区

领取腾讯云代金券