PHP веточка foreach Bootstrap Модальная потребностьПомощь - PullRequest
Новая
       31

PHP веточка foreach Bootstrap Модальная потребностьПомощь

0 голосов
/ 10 марта 2020

Я делаю модальный, модальный показ информации об игроке. У нас есть список игроков, показанных с веточкой foreach на странице. Когда я нажимаю на игрока, я хочу, чтобы информация об игроке. Я пробовал с простым bootstrap модальным, но работает только первый игрок. Я должен использовать ajax запрос?

У меня есть ошибки, кто-нибудь может мне помочь?

Шаблон для изменения: 

<h1 class="monEffectif">Mon effectif</h1>

<div class="globalTable">

<div class="tableLeft">

 {% for trainer in trainers %}
 {% for team in trainer.teams %}

<h2  class="monEffectif">{{ team.name }}</h2>

  {% for category in categories %}

        <table class="table col-10 custom">
        <thead>
            <tr>
                <th>{{ category.Type }} </th> 
                <th>Contact</th>
            </tr>
        </thead>
        <tbody>

        {% for player in category.Person %}

               <tr>
                <td>
                <a href="{{ path('player_showOne', {'id': player.id}) }}" data-toggle="modal" data-target="#dataModal">{{ player.lastname }} {{ player.firstname }}</a>


          <!-- dataModal -->

    <div id="dataModal" class="modal fade">  
        <div class="modal-dialog">  
            <div class="modal-content">  
                <div class="modal-header"> 
                <h4 class="modal-title" id="modal-title">Profil du joueur</h4> 
                    <button type="button" class="close" data-dismiss="modal">&times;</button>  
                </div>  
                <div class="modal-body">  
                <div class="imageModal">
                    <img src="{{ player.picture }} alt="photo du joueur">
                    <p>{{ player.lastname }} {{ player.firstname }}</p>
                </div>

                <div class="blockModal">
                <div class="leftSide">
                    <p>Date de naissance: </p>
                    <p>Nationalité: </p>
                    <p>Adresse: </p>
                    <p>Code postal: </p>
                    <p>Ville: </p>
                    <p>Adresse mail: </p>
                    <p>Numéro portable: </p>
                </div>
                <div class="rightSide">
                    <p>{{ player.birthday|date("d/m/Y") }}</p>
                    <p>{{ player.nationality }}</p>
                    <p>{{ player.address }}</p>
                    <p>{{ player.postal }}</p>
                    <p>{{ player.city }}</p>
                    <p>{{ player.Email }}</p>
                    <p>(+33){{ player.mobilePhone }}</p>
                </div>
                </div>
                </div>  
                <div class="modal-footer">  
                    <button type="button" class="btn btn-default" data-dismiss="modal">Fermer</button>  
                </div>  
            </div>  
        </div>  
    </div>```

1 Ответ

1 голос
/ 11 марта 2020

Очень важно создать уникальные идентификаторы в html, особенно когда вы хотите получить к ним доступ с помощью javascript. 

{% for player in category.Person %}
    <a href="{{ path('player_showOne', {'id': player.id}) }}" data-toggle="modal{{ player.id }}" data-target="#dataModal{{ player.id }}">{{ player.lastname }} {{ player.firstname }}</a>

    <div id="dataModal{{ player.id }}" class="modal fade">  
        ....
    </div>
{% endfor %}
...