Задать вопрос
@f-end
javascript

Как передать HTML объект аяксом в php-скрипт?

Я хочу передать методом POST php-обработчику HTML-страничку целиком. Начиная от
<!DOCTYPE html>
и заканчивая
</html>
. Использую для этого метод $.post (jQuery), который позволяет передавать либо строку, либо объект.
Как передать HTML-содержимое строкой я не придумал. При попытке передать страницу в формате JSON
JSON.stringify(window.document)
я получаю совсем не то, что мне надо:
{"location":{"href":"http://test3.ru/","origin":"http://test3.ru","prot...":""}}

Методы и свойства всякие мне как раз не нужны.

Наверняка есть какой-то простой и очевидный способ передать HTML-код аяксом на сервер, но я никак не могу его найти. Подскажите пожалуйста куда копать.
  • Вопрос задан
  • 2717 просмотров
Комментировать
Подписаться 3 Оценить Комментировать
Пригласить эксперта
Ответы на вопрос 4
enovot
@enovot
Андрей По моему передавать целую страницу вообще плохая идея. Но если вы уж так решили. Вам нужно передавать не JSON данные, а html или text. Метод jQuery.ajax( [settings ] ) принимает объект settings, В свойствах которого нужно указать dataType 
$.ajax({
   url: you_url,
   type : 'POST'
   dataType : 'html',
   data: window.document,
   success: function(data){
     console.log(data);
  }
});

Так должно получиться. подробнее об этом можно почитать тут
Ответ написан
1 комментарий
1 комментарий
@f-end Автор вопроса
На сколько я понимаю, dataType определяет тип данных, которые мы получаем от сервера. А у меня проблема с типом данных, передаваемых на сервер.
Безусловно, я попробовал Ваше решение, но получил ошибку:
TypeError: 'click' called on an object that does not implement interface HTMLElement.
Я так понимаю, что ругается на формат передаваемых данных.

П.С. Страницу целиком я передаю на сервер, чтобы ее сохранить в файл. Она создается в браузере пользователя аяксом и потом при желании ее можно сохранить в файл и скачать.

На всякий случай привожу код целиком:
$("#save-but").on('click', function () {
        var pagePath = "results/" + Math.random().toString(36).substring(2) + ".html";
        var pageContent = window.document;
        $.ajax({
            url: "constructor.php",
            type: 'POST',
            dataType: 'html',
            data: {name: pagePath,content:pageContent}
        });
    });
Ответ написан
Комментировать
Комментировать
@lolzqq
HTML,CSS,JS,PHP
Аякс запрос передаёт строковые данные. Потому вам нужно получать не объект, и не объект jquery, пытаясь его передать на сервер! а получить строковые данные, и присваивать их как значения к ключам. Которые вы уже передадите в вашем POST запросе.
var data="";
data="name="+encodeURIComponent($("ваш_блок").prop("outerHTML"));
data+="content="+encodeURIComponent($("ваш_другой_блок").prop("outerHTML"));
$.ajax({
  url: url,
  type: "POST",
  data: data,
  success: function(){ /*обработчик вашей функции*/}
)}


Вам ещё в настройках PHP на сервере надо будет проверить значение переменной post_max_size и увеличить её под ваши нужды.
Ответ написан
Комментировать
Комментировать
@Mosapi
Мб, кому понадобиться. Для себя нашел вот такой способ, упростив немного ответ - Олег а для передачи не только dom-дерева элемента, но и других параметров.
var par1 = 'какие-то текстовые данные';
var par2 = $("#elem").prop("outerHTML"); //получаем весь dom элемента
$.ajax({
		type: 'post', 
		url: "url", 
		dataType: 'html',
		data: ({
			d: par1,
			v: par2,
		}), 
		success: function(response){}
	});
Ответ написан
1 комментарий
1 комментарий
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы
Вакансии с Хабр Карьеры
JavaScript FullStack разработчик
Rocket • Смоленск
от 80 000 до 130 000 ₽
JavaScript FullStack developer
Wanted. • Санкт-Петербург
До 220 000 ₽
JavaScript Fullstack
OnClass
от 2 000 до 7 000 $
Ещё вакансии
Заказы с Хабр Фриланса
Дорабодки сайта на wordpress
23 дек. 2024, в 20:55
1000 руб./за проект
Технический писатель для мобильного приложения
23 дек. 2024, в 20:39
20000 руб./за проект
Разработка скрипта для мониторинга транзакций на Solana
23 дек. 2024, в 19:45
150000 руб./за проект
Ещё заказы