отобразить результат ajax на новой странице - PullRequest
0 голосов
/ 30 ноября 2018

Я хотел бы отобразить результаты запроса ajax на новой странице, а не на странице, с которой был сделан вызов ajax.По сути, у меня есть страница каталога членства.Когда пользователь щелкает ячейку идентификатора члена на этой странице, ajax-вызов отправляет идентификатор на сервер и завершает таблицу HTML для отображения этого профиля участника.Если я добавлю элемент <div> ниже страницы каталога членства, я могу сделать так, чтобы таблица информации профиля отображалась под таблицей каталога членства.Но я хочу, чтобы таблица профиля отображалась на другой странице.

JavaScript:

$jq.ajax({
    url : ajax_mmmp.ajax_url,
    type : 'post',
    data : {
        action: 'mmmp_profile_member_id_callback',
        mem_id : member_id
    },
    success:function(data) {
        // This outputs the result of the ajax request
        console.log(data);
        // Return response to client side
            alert("Submit Success");
            $jq('#display_profile').html( data );

            return false;
    },
    error: function(errorThrown){
        console.log(errorThrown);
    }
}); // End of AJAX function

Но когда я создаю новую страницу с тем же элементом <div> и пытаюсь открыть эту страницу ранеена вызов ajax результат не отображается.

var mem_profile = "http://localhost:81/wordpress/view-member-profile"
window.open (mem_profile,'_self',false)

$jq.ajax({
    url : ajax_mmmp.ajax_url,
    type : 'post',
    data : {
        action: 'mmmp_profile_member_id_callback',
        mem_id : member_id
    },
    success:function(data) {
        // This outputs the result of the ajax request
        console.log(data);
        // Return response to client side
            alert("Submit Success");
            $jq('#display_profile').html( data );

            return false;
    },
    error: function(errorThrown){
        console.log(errorThrown);
    }
}); // End of AJAX function

Ответы [ 2 ]

0 голосов
/ 02 декабря 2018

После некоторых дальнейших исследований я почти на месте.В настоящее время у меня нет «формы» для отправки.Пользователь просто нажимает на ячейку таблицы, которая содержит идентификационный номер участника.Я хочу «отправить» это значение в качестве ввода на другой странице, которая отображает профиль участника.Мне удалось временно добавить HTML-форму, которая работает как нужно, если я ввожу идентификатор участника в поле ввода.Поэтому я решил, что нужно создать скрытую форму в JS, в которой использовалось значение идентификатора, по которому щелкнули.Похоже, я не могу вставить исправленный код в комментарий, поэтому я решил «Ответить» на мой оригинальный вопрос с обновленным кодом.

Рабочая HTML-форма включена на странице каталога участников:

$site_url = site_url();
$location = $site_url . "/view-member-profile";

?>

<form action="<?php echo $location;?>" method="post">
<input type="text" class="input_member_id" id="input_member_id" name="Member_ID">
<input type="submit" id="submit_member_id" name="submit_member_id" value="Submit">
</form>

Моя попытка создать подобную скрытую форму в JS:

var $jq = jQuery.noConflict();

$jq(document).ready(function(){

// Add listener for Member ID click in member directory

$jq("#mem_dir").delegate(".member_id", "click", function() {
    var mem_id = $jq(this).text();
    var mem_id = mem_id.trim();
    alert ("ID is: " + mem_id);

    var site_url = document.location.origin + '/wordpress';
    var form_location = site_url + '/view-member-profile';
    alert ("Submit to location is: " + form_location);

    var form = $jq('<form method="post" class="js:hidden">').attr('action', form_location);
    //var input = $jq('<input type="hidden"'>).attr('value', mem_id );
    //form.append(input);
    //$jq('body').append(form);
    form.submit();

}); // End of Click Member ID Listener

}); // End of Main Document Ready Function

Проблема, с которой я сталкиваюсьфайл JS с вставкой значения mem_id в форму ввода.Файл JS правильно открывает новую страницу просмотра профиля пользователя.(Обратите внимание на 3 // строки непосредственно перед form.submit).При отсутствии комментариев открывается страница профиля, но значения таблиц пусты (т. Е. Значение mem_id не было передано на страницу).

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

0 голосов
/ 30 ноября 2018

Если оставить в стороне вопрос о том, стоит ли придерживаться такого подхода, ответ на ваш вопрос - да.Вы можете открыть новое окно и записать полученный HTML-код в него:

// open a new window with no url and a title. check the docs for other args to open()
let win = window.open('','My New Window');
// write some HTML to that window
win.document.write('<table><tr><th>test</th></tr></table>');
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...