За последние 24 часа нас посетили 19148 программистов и 1638 роботов. Сейчас ищет 1771 программист ...

Модальное окно

Тема в разделе "JavaScript и AJAX", создана пользователем Salvat, 19 окт 2016.

  1. Salvat

    Salvat Новичок

    С нами с:
    4 мар 2016
    Сообщения:
    101
    Симпатии:
    0
    Здравствуйте. Имеется такой код
    PHP:
    1. $allusers .= "<tr><td rowspan='5'><a href='profile.php?id=" . $row['id']."'>
    2.                    <img style='width:150;height:200px;' src='$avatar'></td>
    3.                    <td><a href='profile.php?id=" . $row['id']."'>" . $row['first_name'] . "&nbsp;". $row['last_name'] . "</a>&nbsp;</td></tr>
    4.                    <tr><td>Страна: <a href='search.php?country_id=".$row['country_id']."'>".  $row['country']."</a>&nbsp;</td></tr>
    5.                     <tr><td>Регион: <a href='search.php?country_id=".$row['country_id']."&region_id=".$row['region_id']."'>".  $row['region']."</a>&nbsp;</td></tr>
    6.                    <tr><td>Город: <a href='search.php?country_id=".$row['country_id']."&region_id=".$row['region_id']."&city_id=".$row['city_id']."'>".  $row['city']. "</a></td></tr>
    7.                    <tr><td></td></tr>
    8.                    <tr><td>".$status."</td></tr>    <tr>
    9.                    <td colspan='2'><br/><div class='profile_mess_search'>
    10.                    <a href='#openModal'><b>Написать сообщение</a></b></div><div id='openModal' class='modalDialog'><div>
    11.                    <a href='#close' title='Закрыть' class='close'>X</a>
    12.                    <form methos='post' action=''>
    13.                    <table style='font-size:12px;'>
    14.                    <tr><td rowspan=4><a href='profile.php?id=" . $row['id']."'><img style='width:150;height:200px;' src='$avatar'></a>
    15.                    </td><td><input type='text' name='message_subject' value='' placeholder='Тема сообщения'></td></tr>
    16.                    <tr><td><textarea placeholder='Сообщение'></textarea></td></tr>
    17.                    </table><br/>
    18.                    <input type='submit' name='send_message' value='Отправить'/>
    19.                    </form>
    20. </div> </div></td>
    21.                    </tr><tr><td style='height:20px;'></td></tr>";
    Это вывод данных. Данные корректно пользователей. Я хочу вызывать модальное окно по клику на <a href='#openModal'><b>Написать сообщение</a>. Модальное окно вызывается. Но аватар передается только последнего пользователя. Где переменная $avatar есть сам аватар. Подскажите, каким образом мне при клике на определенного пользователя выводить нужные мне данные, его аватар, ф.и.о и т.д. За ранее спасибо. Прикладываю скри-шот вывода модального окна. Клик был по другому пользователю у которого имелся аватар, а в результате получил этот.
     

    Вложения:

  2. denis01

    denis01 Суперстар
    Команда форума Модератор

    С нами с:
    9 дек 2014
    Сообщения:
    12.227
    Симпатии:
    1.714
    Адрес:
    Молдова, г.Кишинёв
    Можно на javascript заполнять модальное окно или наплодить их для каждого пользователя.
    Смотри, ты вызываешь модальное окно по его id OpneModal, но id должно быть уникальное на странице, если ты делаешь 10 модальных окон с 1 id, то и откроется только последнее например.
     
    Salvat нравится это.
  3. Salvat

    Salvat Новичок

    С нами с:
    4 мар 2016
    Сообщения:
    101
    Симпатии:
    0
    @denis01, благодарю за ответ. Не могли бы привести пожалуйста, если не затруднит, эти два примера.
     
  4. denis01

    denis01 Суперстар
    Команда форума Модератор

    С нами с:
    9 дек 2014
    Сообщения:
    12.227
    Симпатии:
    1.714
    Адрес:
    Молдова, г.Кишинёв
    @Salvat нет.
    Делай один openModal, в него можешь раскидать div с id чтобы туда свои данные вставлять,
    когда генерируешь ссылку, то добавь в неё данные которые хочешь вставить в модальное окно, для данных использую атрибут data в ссылке.
    Вот пример на bootstrap http://getbootstrap.com/javascript/#modals-related-target
    В примере смотри на button data-whatever и потом как его вставляют в модальное окно
    Код (Javascript):
    1. var recipient = button.data('whatever')
    2. //....
    3. modal.find('.modal-title').text('New message to ' + recipient)