Как вывести в модальном окне подгрузку информации по выбранному элементу в PHP?

Question

[jakiro70000]

Как в модальном окне подгружать информацию о выбранной работе через ajax?
Вывод всех работ:

<?php
    $sql = "select * from services";
    $result=$connection->query($sql);
    foreach($result as $row){
    echo '
            <div class="services-item">
                <img src="img/services/'.$row['img_s'].'" alt="" class="services-img">
                <div class="services_text">
                    <p class="services-title">'.$row['name_s'].'</p>
                    <p class="services-subtitle">'.$row['opis_s'].'</p>
                </div>
            </div>
            ';}
?>

Модальное окно выбранной работы:

<?php
                        $id=$_REQUEST['id'];
                        $sql='SELECT name_w, stek, site, img_w, made_by_me from works where id_w='.$id;
                        $result=$connection->query($sql);
                        foreach($result as $rows){
                            echo '

                    <div class="modal_head">
                        <div class="modal-group">
                            <h2 class="work-heading">Название:</h2>
                            <p class="work-name">'.$rows['name_w'].'</p>
                        </div>
                        <div class="modal-group">
                            <h2 class="work-heading">Стек:</h2>
                            <p class="work-stack">'.$rows['stek'].'</p>
                        </div>
                        <div class="modal-group-site">
                            <h2 class="work-heading">Сайт:</h2>
                            <a href="'.$rows['site'].'" target="_blank" class="work-site_link">Перейти</a>
                        </div>
                    </div>
                    <div class="modal_item-img">
                        <img src="img/works/'.$rows['img_w'].'" alt="" class="work-img">
                    </div>
                    <div class="modal_item">
                        <div class="modal-group-description">
                            <h2 class="work-heading by_me">Что сделано мной:</h2>
                            <ul class="work-description_list">
                                <li class="work-description_list-item">
                                    <p class="work-description">Адаптивная, кроссбраузерная верстка сайта с нуля.</p>
                                </li>
                                <li class="work-description_list-item">
                                    <p class="work-description">Сознание анимации.</p>
                                </li>
                                <li class="work-description_list-item">
                                    <p class="work-description">Сознание слайдеров.</p>
                                </li>
                                <li class="work-description_list-item">
                                    <p class="work-description">Сознание форм обратной связи и анимации.</p>
                                </li>
                            </ul>
                        </div>
                    </div>
            ';}
?>

ajax который передает data-id каждой работы:

$(document).ready(function(){
    $(".open-modal-work-js").click(function () {
        var modal = $('.modal-window');
        var id = $(this).attr("data-id");
        $.post("/index.php"+id, {}, function (data) {
            modal.fadeIn();
            $('body').css({overflow:'hidden'});
        });
        return;
    });
});

Куда копать дальше? Как в модальное окно подгружать информацию о выбранной работе?

Answer 1

[lUser L]

Лучше бы прислушался к совету к прошлому вопросу, но вместо этого ты продублировал вопрос.
Хотя, аякс, ты все же загуглил

//сразу от body обращаемся, что бы избежать следующего вопроса -  "а почему не работает клик, если подгружать динамически модалку " 
$('body').on('click', '.open-modal-work-js', function(){
    var get_id = $(this).attr("data-id");
	$.ajax({
		type: 'POST',
		url: '/path-to-action.php',
		data: {
			id: get_id
		},
		success: (data) => {
			$('.modal-window').show().html(data);
		}			
	});
});

php

$id = $_POST['id'];
$sql= "SELECT * FROM works WHERE id_w = ".$id." ";

Но так категорически не советую делать, а лучше еще раз процитирую коммент с прошлого вопроса

запрос составлен не верно и кишит sql инъекциями, предлагаю почитать что это - sql инъекции и заодно взглянуть на pdo. так же на примеры ajax запросов в связке php и mysql

Comments

[jakiro70000]

Спасибо!