Заполните ли содержание в зависимости от результатов базы данных - PullRequest
Новая
       24

Заполните ли содержание в зависимости от результатов базы данных

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

Я работаю с обезжиренным фреймворком и в настоящее время работаю над созданием брекетов для соревнований.

То, что я делаю, - это прохождение нескольких участников (из разных «слоев») в представление для отображения их в видедерево.Базовая стилизация взята из этой кодовой ручки .

Теперь проблема в том, что я не знаю каждое поле с самого начала, так как в результате первых двух соревнований решается, как следующий уровеньвыглядит (четвертьфинал в этом случае).Проблема, однако, в том, что если я не помещу туда поля, то полный макет будет уничтожен, поэтому я добавлю пустые <li> элементы для слоя, где конкуренты пока не ясны, просто так: 

<li class="team-item">&nbsp;</li>
<li class="team-item">&nbsp;</li>
<li class="team-item">&nbsp;</li>
<li class="team-item">&nbsp;</li>

То же самое для полуфинала и финала, тогда только с 2 и 1 <li> с.

Теперь в некоторых ячейках четверти / полуфинала у меня уже есть кое-что в моей базе данных,Например, если в "layer1" есть 8 соревнований, то в "layer2" у меня будет 4 пустых поля, соответственно, в четвертьфинале.Эти 4 поля должны быть предопределены, чтобы сохранить макет.Теперь, может быть, у меня уже заполнено только одно или два из этих полей, потому что другие соревнования еще не закончены

Таким образом, я должен всегда предопределять поля, как в коде выше.Теперь возникает вопрос: как мне заменить один пустой <li> на заполненный или альтернативно, как мне заполнить пустой <li> информацией, если она предоставлена? 

<ul class="bracket bracket-2">
      <repeat group="{{ @bracket }}" value="{{ @item }}">
        <check if="{{@item.layer == 2}}">
        <!-- li should be filled with this content, if the condition is true, so if in here -->
        <li class="team-item">{{ @item.Vorname1  }} {{ @item.Name1  }} <a href="/getFighterInformation/{{@item.fighter1ID}}"<i class="fa fa-pencil-alt"></i></a>&nbsp;<i class="fa fa-trophy"></i></li> 
      <li class="team-item">{{ @item.Vorname2  }} {{ @item.Name2  }} <a href="/getFighterInformation/{{@item.fighter2ID}}"<i class="fa fa-pencil-alt"></i></a>&nbsp;<i class="fa fa-trophy"></i></li>
  </check>
    </repeat>
  <!-- This should be predefined -->
  <li class="team-item">&nbsp;</li>
  <li class="team-item">&nbsp;</li>
  <li class="team-item">&nbsp;</li>
  <li class="team-item">&nbsp;</li>
  <!-------------------------------->
    </ul>

Это пример дляслой 2 с 8 соревнованиями в слое 1.

Я надеюсь, вы понимаете, о чем я, но это довольно сложно объяснить ...

Итак, подведем итог: вопрос: возможно ли заранее определитьперечислить элементы, а затем заполнить или заменить их, если условие if соответствует?

РЕДАКТИРОВАТЬ:

Это то, что я получаю из базы данных, заполненной переменной скобки: 

array(4){
   [
      0
   ]   => array(15)   {
      [
         "ID"
      ]      => string(1) "1"      [
         "eventID"
      ]      => string(1) "1"      [
         "kategorie"
      ]      => string(4) "FA62"      [
         "ebene"
      ]      => string(1) "3"      [
         "fighter1ID"
      ]      => string(2) "21"      [
         "Vorname1"
      ]      => string(5) "one"      [
         "Name1"
      ]      => string(4) "one"      [
         "Geburtsdatum1"
      ]      => string(10) "1999-04-04"      [
         "fighter1Pos"
      ]      => string(1) "0"      [
         "fighter2ID"
      ]      => string(2) "19"      [
         "Vorname2"
      ]      => string(8) "two"      [
         "Name2"
      ]      => string(4) "two"      [
         "Geburtsdatum2"
      ]      => string(10) "1988-12-11"      [
         "fighter2Pos"
      ]      => string(1) "1"      [
         "result"
      ]      => string(1) "0"
   }   [
      1
   ]   => array(15)   {
      [
         "ID"
      ]      => string(1) "2"      [
         "eventID"
      ]      => string(1) "1"      [
         "kategorie"
      ]      => string(4) "FA62"      [
         "ebene"
      ]      => string(1) "3"      [
         "fighter1ID"
      ]      => string(2) "25"      [
         "Vorname1"
      ]      => string(5) "three"      [
         "Name1"
      ]      => string(4) "three"      [
         "Geburtsdatum1"
      ]      => string(10) "1988-08-18"      [
         "fighter1Pos"
      ]      => string(1) "2"      [
         "fighter2ID"
      ]      => string(2) "24"      [
         "Vorname2"
      ]      => string(5) "four"      [
         "Name2"
      ]      => string(4) "four"      [
         "Geburtsdatum2"
      ]      => string(10) "1985-08-17"      [
         "fighter2Pos"
      ]      => string(1) "3"      [
         "result"
      ]      => string(1) "0"
   }   [
      2
   ]   => array(15)   {
      [
         "ID"
      ]      => string(1) "3"      [
         "eventID"
      ]      => string(1) "1"      [
         "kategorie"
      ]      => string(4) "FA62"      [
         "ebene"
      ]      => string(1) "3"      [
         "fighter1ID"
      ]      => string(2) "23"      [
         "Vorname1"
      ]      => string(5) "five"      [
         "Name1"
      ]      => string(4) "five"      [
         "Geburtsdatum1"
      ]      => string(10) "1966-06-16"      [
         "fighter1Pos"
      ]      => string(1) "4"      [
         "fighter2ID"
      ]      => string(2) "20"      [
         "Vorname2"
      ]      => string(8) "six"      [
         "Name2"
      ]      => string(4) "six"      [
         "Geburtsdatum2"
      ]      => string(10) "1966-03-03"      [
         "fighter2Pos"
      ]      => string(1) "5"      [
         "result"
      ]      => string(1) "0"
   }   [
      3
   ]   => array(15)   {
      [
         "ID"
      ]      => string(1) "4"      [
         "eventID"
      ]      => string(1) "1"      [
         "kategorie"
      ]      => string(4) "FA62"      [
         "ebene"
      ]      => string(1) "3"      [
         "fighter1ID"
      ]      => string(2) "18"      [
         "Vorname1"
      ]      => string(6) "seven"      [
         "Name1"
      ]      => string(4) "seven"      [
         "Geburtsdatum1"
      ]      => string(10) "1985-08-17"      [
         "fighter1Pos"
      ]      => string(1) "6"      [
         "fighter2ID"
      ]      => string(2) "22"      [
         "Vorname2"
      ]      => string(9) "eight"      [
         "Name2"
      ]      => string(4) "eight"      [
         "Geburtsdatum2"
      ]      => string(10) "1995-09-15"      [
         "fighter2Pos"
      ]      => string(1) "7"      [
         "result"
      ]      => string(1) "0"
   }
}

В одной коробке должен быть только один, а не два бойца.Таким образом, каждый элемент массива представляет один бой, содержащий два бойца (на которые ссылается fighter1ID / fighter2ID, соответственно Name1, Name2 и т. Д.).Затем fighter1Pos и ​​fighter2Pos вместе со значением «ebene», которым является слой (3, 2, 1 или 0), определяют положение в скобке, поэтому слой 3 с fighter1Pos 7 будет последней «коробкой» в слое3 (считая от 0 до 7).

Ответы [ 3 ]

1 голос
/ 31 мая 2019

Я думаю, вам лучше подготовить данные, прежде чем передавать их в шаблон.

Если ваш массив $brackets выглядит следующим образом: 

$brackets = [
  // first bracket
  1 => [
    [
      'A' => ['name' => 'John', 'id' => 123],
      'B' => ['name' => 'Jim', 'id' => 110],
      'time' => '20:00',
    ],
    [
      'A' => ['name' => 'Mary', 'id' => 141],
      'B' => ['name' => 'Bill', 'id' => 190],
      'time' => '14:00',
    ],
    //etc. (8 competitions)
  ],
  // second bracket
  2 => [
    [
      'A' => ['name' => 'John', 'id' => 123],
      'B' => ['name' => 'Mary', 'id' => 141],
      'time' => '18:00',
    ],
    //etc. (4 competitions)
  ],
  // third bracket
  3 => [
    [
      'A' => ['name' => 'John', 'id' => 123],
      'B' => NULL, // competitor B not known yet
      'time' => '16:00',
    ],
    //etc. (2 competitions)
  ],
  // last bracket (final)
  4 => [
    [
      'A' => NULL, // competitor A not known yet
      'B' => NULL, // competitor B not known yet
      'time' => '20:00',
    ],
  ],
];

Тогда ваш шаблон будет просто выглядеть следующим образом: 

<div class="tournament-brackets">
  <repeat group="@brackets" key="@k" value="@competitions">
    <ul class="bracket bracket-{{ @k}}">
      <repeat group="@competitions" value="@competition">
        <li class="team-item">
          <check if="@competition.A">
            <true>
              {{ @competition.A.name }}
              <a href="/getFighterInformation/{{ @competition.A.id }}
            </true>
            <false>
              Unknown competitor
            </false>
          </check>
          <time>{{ @competition.time }}</time>
          <check if="@competition.B">
            <true>
              {{ @competition.B.name }}
              <a href="/getFighterInformation/{{ @competition.B.id }}
            </true>
            <false>
              Unknown competitor
            </false>
          </check>
        </li>
      </repeat>
    </ul>
  </repeat>
0 голосов
/ 30 мая 2019

Да, вы можете выбрать элемент списка, используя JavaScript, а затем добавить к нему текст.

Возьми этот список: 

<ul>
<li class="team-item">Result 1</li>
<li class="team-item">Result 2</li>
<li class="team-item">Waiting for Result...</li>
<li class="team-item">Waiting for Result...</li>
</ul>

и затем добавьте скрипт, как в примере ниже: 

const resultsList = document.getElementsByTagName('ul')[0];
const resultsListItems = resultsList.getElementsByTagName('li');

resultsListItems[2].textContent = 'Result 3'; 
<ul>
<li class="team-item">Result 1</li>
<li class="team-item">Result 2</li>
<li class="team-item">Waiting for Result...</li>
<li class="team-item">Waiting for Result...</li>
</ul>
0 голосов
/ 30 мая 2019

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

Это не имеет никакого смысла вообщеиметь длинный список пустых элементов LI;если вы хотите, чтобы в макете страницы список никогда не был короче x строк, то вам следует добавить что-то вроде 

ul {min-height:10em;}

в таблицу стилей.

Добавление элементов вHTML только для достижения определенного макета никогда не является хорошей идеей, и попытка добавить элементы-заполнители для последующего их удаления - плохая идея не только для семантического аспекта вашего HTML-кода, но и для отзывчивости вашего пользовательского интерфейса.для пользовательских команд!:)

...