Добавление PHP в динамически создаваемый контент div

Question

Я делаю веб-сайт с подменю, которое отображает контент для div. Сайт работает на Wordpress, и эта часть сайта является плагином, который я сделал. Я хочу, чтобы содержимое div извлекало информацию из базы данных, т.е. я хочу добавить код PHP. Не могу добавить ни одного PHP. Если я сделаю загруженный контент файлом PHP, он не будет работать из-за jQuery('#pageContent').html(msg) в JS, и если я добавлю код PHP в файл HTML, этот код, похоже, не будет распознан. Каков был бы способ сделать это? Возможно, мне следует добавить, что PHP, который я хочу добавить, должен быть частью формы и, насколько я вижу, должен находиться в том же файле, что и HTML.

Вот функция JS с Ajax длязагрузить контент:

function loadPage(url)  //the function that loads pages via AJAX
{   
    url=url.replace('#page','');    //strip the #page part of the hash and leave only the page number

    jQuery('#loading').css('visibility','visible');  //show the rotating gif animation   

    jQuery.ajax({    //create an ajax request to load_page.php
        type: "POST",
        url: ajax_object.ajax_url,
        data: {
            action: 'ajax_request2',
            page: url //with the page number as a parameter
        },
        dataType: "html",   //expect html to be returned
        error: function(xhr, textStatus, textError) { 
            console.log(textError);
        },
        success: function(msg) {
            window.alert("Working loadPage ajax!");
            if(parseInt(msg)!=0)    //if no errors
            {
                jQuery('#pageContent').html(msg);    //load the returned html into pageContent
                jQuery('#loading').css('visibility','hidden');   //and hide the rotating gif
            }
        }
    });
}

Answer 1

Я немного изменил вашу функцию и направил ее на тестовую площадку для данных JSON. Этот маленький фрагмент работает. Может быть, это полезно для вас?

Поскольку тестовый сайт возвращает только JSON, "html", который я вставил в #pageContent, на самом деле не является html, но я надеюсь, что вы все равно поймете.

Если вы хотите знать, что вернул Ajax, вы всегда можете вставить console.log(msg) в нужном месте (см. Закомментированную строку ниже).

И - просто чтобы было ясно - если загруженный контент предназначен длясгенерированный PHP-скриптом, тогда URL в вашей функции loadPage, конечно, должен указывать на PHP-скрипт на соответствующем сервере. Этот скрипт будет искать данные и обрабатывать их в желаемом формате html перед отправкой обратно в ответ на запрос Ajax.

function loadPage(url){   
    url=url.replace('#page',''); //strip the #page part of the hash and leave only the page number
    jQuery('#IAmloading').show();  //show the rotating gif animation   
    jQuery.ajax({    //create an ajax request to load_page.php
        type: "GET",
        url: url, // the URL of the page to be loaded ...
        data: {action: 'ajax_request2', id: 4},  //your further parameters ...
        dataType: "json",                            //expect json to be returned
        error: function(xhr, textStatus, textError) { console.log(textError);},
        success: function(msg){ console.log("Working loadPage ajax!");
            // console.log(msg);  // show what the AJAX request returned
            if(msg)    //if no errors
            {
                
                jQuery('#pageContent').html(JSON.stringify(msg));  //put msg into pageContent
                jQuery('#IAmloading').hide();   //and hide the rotating gif
            }
        }
    });
}

// call the function with the URL of a test site (returns JSON only ...):
loadPage('https://jsonplaceholder.typicode.com/users');

#IAmloading {visibility: hidden}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="IAmloading">Please wait, page is loading ...</div>
<div id="pageContent"></div>