2015-10-25 1 views
0

Я передаю список файлов вместе с их каталогами в свой вид Razor. Мне удалось перечислить их все, чтобы облегчить загрузку, но теперь меня попросили организовать их в стиле аккордеона.с использованием аккордеона для каждой записи

Я пытаюсь использовать аккордеон JqueryUi, однако его трудно реализовать, используя для каждого, чтобы заполнить ссылки.

это то, что я до сих пор:

@foreach (var fullPath in Model) 
{ 
    var fileName = Path.GetFileName(fullPath); 

    var parent = System.IO.Directory.GetParent(fullPath); 
    string parentString = parent.ToString(); 

    var downloadPath = @Path.GetDirectoryName(fullPath) + "\\" + @fileName; 
    string yearOne = Server.MapPath("~/Pdfs/YearOne"); 
    string yearTwo = Server.MapPath("~/Pdfs/YearTwo"); 


    <div id="accordion"> 
     @*<h3>Year One</h3>*@ 
     @if (parentString == yearOne) 
     { 
      <div> 
       <p> 
        <ul> 
         <li>@Html.ActionLink(fileName, "Download", new { path = downloadPath }) </li> 
        </ul> 
       </p> 
      </div> 
     } 

     @*<h3>Year Two</h3>*@ 
     @if (parentString == yearTwo) 
     { 
      <div> 
       <p> 
        <ul> 
         <li>@Html.ActionLink(fileName, "Download", new { path = downloadPath }) </li> 
        </ul> 
       </p> 
      </div> 
     } 
    </div> 
} 

То, что происходит, его размещения первой записи в соответствующем разделе аккордеона, то остальные просто перечислены ниже. Может ли кто-нибудь предложить, как я мог бы достичь этого требования в пределах каждого из них?

+2

Элементы DIV имеют одинаковый идентификатор «гармошкой», используя класс вместо идентификатора бы сделать правильный селектор. –

+0

Хороший момент, однако у меня будет несколько аккордеонов, поэтому я думаю, что они не будут работать как один. – JsonStatham

+0

Я изменил это, и он просто помещает все ссылки в свой собственный аккордеон, который ничего не делает, потому что есть только одна строка. – JsonStatham

ответ

1

Логика поиска того, какой путь за год первый и который на второй год может быть перенесена в контроллер. Соответствующая модель могла бы быть:

public class AccordionModel 
{ 
    public List<string> YearOne { get; set; } 
    public List<string> YearTwo { get; set; } 
} 

вид может быть изменен на:

@model AccordionModel 

@functions { 
    string GetFileName(string path) 
    { 
     var fileName = Path.GetFileName(path); 
     return fileName; 
    } 

    string GetDownloadPath(string path) 
    { 
     var fileName = Path.GetFileName(path); 

     var parent = System.IO.Directory.GetParent(path); 
     string parentString = parent.ToString(); 

     var downloadPath = Path.GetDirectoryName(path) + "\\" + fileName; 
     return downloadPath; 
    } 
} 

<div id="accordion"> 
    @*<h3>Year One</h3>*@ 
     <div> 
      <p> 
       <ul> 
        @foreach(var path in Model.YearOne) 
        { 
         <li>@Html.ActionLink(GetFileName(path), "Download", new { path = GetDownloadPath(path) }) </li> 
        } 
       </ul> 
      </p> 
     </div> 

    @*<h3>Year Two</h3>*@ 
     <div> 
      <p> 
       <ul> 
        @foreach(var path in Model.YearTwo) 
        { 
         <li>@Html.ActionLink(GetFileName(path), "Download", new { path = GetDownloadPath(path) }) </li> 
        } 
       </ul> 
      </p> 
     </div> 
</div> 
+0

Мне довелось сделать это, прежде чем вы ответили, но это действительно правильный подход, спасибо. – JsonStatham