Pro jQuery

Pro jQuery

Адам Фриман

Делаем POST запрос

Можно установить тип желаемого HTTP запроса, если использовать настройку type. Запросом по умолчанию является GET, как показано в предыдущем примере. В листинге 15-4 вы увидите, как при помощи метода ajax создать POST запрос и отправить данные из формы на сервер.

Листинг 15-4: Создание POST запроса при помощи метода ajax
<script type="text/javascript">
	$(document).ready(function () {
		$.ajax({
			url: "mydata.json",
			success: function (data) {
				var template = $('#flowerTmpl');
				template.tmpl(data.slice(0, 3)).appendTo("#row1");
				template.tmpl(data.slice(3)).appendTo("#row2");
			}
		});

		$('button').click(function (e) {
			$.ajax({
				url: $('form').attr("action"),
				data: $('form').serialize(),
				type: 'post',
				success: processServerResponse
			})
			e.preventDefault();
		})

		function processServerResponse(data) {
			var inputElems = $('div.dcell').hide();
			for (var prop in data) {
				var filtered = inputElems.has('input[name=' + prop + ']')
					.appendTo("#row1").show();
			}
			$('#buttonDiv, #totalDiv').remove();
			$('#totalTmpl').tmpl(data).appendTo('body');
		}
	});
</script>
<script id="totalTmpl" type="text/x-jquery-tmpl">
	<div id="totalDiv" style="clear: both; padding: 5px">
		<div style="text-align: center">Total Items: <span id="total">${total}</span></div>
		<div id="Div1">
			<button type="submit">Place Order</button></div>
	</div>
</script>

В дополнение к type я использовал несколько настроек. Чтобы указать цель POST запроса, я использовал настройку url, которую я описал ранее. В этом примере я беру в документе url цели из элемента form. Я указываю данные, которые должны быть отправлены, используя настройку data, которую я установил при помощи метода serialize, описанного главе 33.

Выходя за рамки GET и POST

Можно использовать настройку type, чтобы указать любой HTTP метод, но вы можете испытывать сложности, если будете использовать что-то другое, а не GET или POST. Это случается потому, что многие файерволы и сервера конфигурированы таким образом, что отклоняют другие виды запросов. Если вы хотите использовать другие HTTP запросы, вы делаете POST запрос, но добавляете заголовок X-HTTP-Method-Override, устанавливая его для метода, который вы хотите использовать, например, вот так:

X-HTTP-Method-Override: PUT

Это соглашение широко поддерживается фреймворками веб приложений и является распространенным способом создания веб приложений RESTful (Representational State Transfer, "передача состояния представления"), о чем вы более подробно можете прочитать на http://en.wikipedia.org/wiki/Representational_state_transfer. Информацию о том, как можно установить заголовок jQuery Ajax запроса можно найти в разделе "Установка тайм-аутов и заголовков".

или RSS канал: Что новенького на smarly.net