部分查看数据的问题

时间:2017-01-17 09:25:46

标签: asp.net-mvc partial-views

我对部分视图有疑问。它第一次呈现时一切正常,但之后一些数据被释放。

这是我的页面看起来的样子:这是第一次呈现局部视图的时候

enter image description here

但是当我点击一个类别来检查他的子类别时,图像为空,它不再可见。 (只有名称可见)

enter image description here

这是我的部分观点:

 @model IEnumerable<OnlineCarStore.Models.CategoriesVM>

<div class="container">
<div class="row">
    @using (Html.BeginForm("SubCategories", "Product"))
    {
        <div class="list-group col-sm-3" style="width:280px;">
            @{var selected = string.Empty;
                if (@HttpContext.Current.Session["selectedCar"] == null)
                {
                    selected = string.Empty;
                }
                else
                {
                    selected = @HttpContext.Current.Session["selectedCar"].ToString();
                }

                foreach (var c in Model)
                {
                    <a href="@Url.Action("SubCategories", "Product", new { selected = @selected, id = @c.ID, category = @c.CategoryName })" class="list-group-item">
                        <span> @c.CategoryName</span>
                    </a>
                }
            }
        </div>

        <div class="col-sm-9">
            @foreach (var c in Model)
            {
            <div class="card-group" style="width:200px; display: inline-block">
                <div class="card card">
                    <a href="@Url.Action("SubCategories", "Product", new { selected = @HttpContext.Current.Session["selectedCar"].ToString(), id = @c.ID, category = @c.CategoryName })" id="linkOnImg" class="card-group">
                        <img class="card-img-top center-block" src="@string.Format("../content/images/categories/{0}.jpg", @c.AtpID)" alt=@c.CategoryName style="padding-top: 5px">
                        <div class="card-text text-center">
                            <p class="category-card-title ">
                                <span class="text-muted">@c.CategoryName</span>
                            </p>

                        </div>
                    </a>
                </div>
            </div>
            }
        </div>
                }
</div>

这是Subcategoris视图,其中第二次呈现局部视图:

<div class="container">
<div class="row">       
    @Html.Partial("/Views/Home/CategorieTypes.cshtml"); 

以下是产品控制器子类别方法:

 public ActionResult SubCategories(string selected, int id, string category)
    {
        List<CategoriesVM> listOfCategories = new List<CategoriesVM>();

        var list = db.Categories.ToList();
        var root = list.GenerateTree(c => c.ID, c => c.ParentId).ToList();



        TreeItem<Categories> found = null;
        var test = new TreeItem<Categories>();

        foreach (var rootNode in root)
        {
            found = TreeGenerator.Find(rootNode, (n) => n.Item.ID == id);
            if (found != default(TreeItem<Categories>))
            {
                test = found;
                break;
            }                
        }

        foreach (var item in found.Children.ToList())
        {
            CategoriesVM categoryv = new CategoriesVM();
            categoryv.ID = item.Item.ID;
            categoryv.AtpID = item.Item.AtpID;
            categoryv.Childrens = item.Children.ToList();
            categoryv.CategoryName = item.Item.AtpName;//.Name;

            listOfCategories.Add(categoryv);
        }

        SiteMaps.Current.CurrentNode.Title = selected + " " + category;

        var tests = found.Children.ToList();
        if (found.Children.ToList().Count == 0 )
        {
            return View("Index");
        }
        else
        {
           return View("SubCategories", listOfCategories);
        }            
    }

我已经在开发者工具中检查了图像的来源是否正确,虽然它是正确的,但图片没有显示:

enter image description here

enter image description here

你可以帮我解决这个问题吗?我做错了什么?为什么在第一次渲染局部视图后图像不会出现?提前谢谢!

1 个答案:

答案 0 :(得分:2)

部分视图的路径为Strings,图片的路径为Glade.XML gxml = new Glade.XML ("gui.glade", "PublicanCreators", null);

在局部视图中,您使用/Views/Home/CategorieTypes.cshtml作为图像的路径,这意味着它将搜索无效的路径/Content/images/categories

删除../content/images/categories/属性中的两个点,然后添加/Views/Content/Images/Categories,这样就像:src

再添加一个~,以便向下一级到目录,如:
~/Content/Images/Categories/{img}