Как сопоставить таблицу <td></td> на основе <th></th> в Умбрако - PullRequest
Новая
       54

Как сопоставить таблицу <td></td> на основе <th></th> в Умбрако

0 голосов
/ 27 мая 2019

У меня есть некоторые проблемы при попытке сопоставить th с элементами td в таблице, мой код работает нормально, но я показываю данные, но не в порядке th. Что я могу сделать, чтобы сделать это работает, как притворяться? Любая помощь будет оценена

enter image description here Мой код 

<div class="table-responsive ">
                <table class="table table-striped ">
                  <thead>
                    <tr>
                      <th scope="col">Fundo</th>
                      <th scope="col">IFI</th>
                      <th scope="col">Prospeto</th>
                      <th scope="col">KiiD</th>
                      <th scope="col">Mercado Alvo</th>
                      <th scope="col">Síntese Mensal</th>
                      <th scope="col">Relatório Mensal</th>
                      <th scope="col">Relatório Semestral</th>
                      <th scope="col">Relatório Anual</th>
                    </tr>
                  </thead>
                 <tbody>

                     @foreach (var page in selection.Children){

                        if(page.Children.Count() > 0){ 

                        foreach(var subpage in page.Children){

                            var listaPdf = subpage.GetPropertyValue<IEnumerable<IPublishedContent>>("listaPdfsFundos");

                               if(listaPdf == null) {
                                    listaPdf = new List<IPublishedContent>();
                                }

                                 <tr>

                                 <td >@subpage.Name</td>

                                 @if(listaPdf != null){

                                    foreach(var row in listaPdf) {

                                    var name = Umbraco.Field(row, "categoriaDoFundo");

                                    var id = Umbraco.Field(row, "documentos").ToString();

                                    var mediaItem = Umbraco.TypedMedia(id);

                                    var url = mediaItem.Url;

                                    <td> <a href="@url" target="_blank"><i class="far fa-file-pdf"></i> </a> </td>

                                    }   
                                }   
                       </tr>    
                    }
                }
             }

              </div>

1 Ответ

2 голосов
/ 28 мая 2019

Это все, что связано со структурой ваших данных и тем, как вы пытаетесь выложить их в таблицу с фиксированным числом столбцов

В любом случае, с вашей картинки и вашего html, выглядиткак у вас 9 столбцов.

Вы заполняете listaPdf 

var listaPdf = subpage.GetPropertyValue<IEnumerable<IPublishedContent>>("listaPdfsFundos");`

Чуть позже вы пишете первый столбец 

<td >@subpage.Name</td>

, что, безусловно, нормально,Так что на 1 столбец вниз и на 8 больше.

Теперь ваши проблемы начинаются.Чтобы ваш код работал, вы должны выписать 8 * <td> элементов, чтобы соответствовать вашим <th> заголовкам (1 уже написано) + 8).

Если listaPdf не содержит ровно 8 элементов, он не будет работать.На изображении выше показано, что listPdf содержал 3 элемента, поэтому вы записали 4 * <td>, которые не совпадают с 9 * <th>

Итак, первое, что нужно проверить, - содержит ли listaPdf 8 элементов.Если этого не произойдет, вы не сможете заставить вышеуказанный код работать, не найдя способа связать каждый mediaItem с правильным столбцом.

Есть ли в каждом mediaItem что-нибудь, что связывает этот элемент с правильным столбцом?

...