Метод Load позволяет не только загрузить ответ сервера, но и отправить на него данные для последующей обработки. Подробное описание функции есть в API jQuery В данном примере мы посмотрим на некоторые примеры использования данной функции. Отправка данных осуществляется методом POST.
Как загружать ответ сервера?
В прошлом, вводном посте мы посмотрели на вот такой пример
App.js
1 2 3 4 5 |
$(function(){ $('button').click(function(){ $('#mydiv').load('ajaxServerAnswer.php'); }); }); |
ajaxServerAnswer.php
1 2 3 |
<?php echo "<h3> Some Answer from Server</h3>"; ?> |
В принципе, тут все понятно – загружаем в div html разметку – результат php скрипта. Можно было обратиться и по любому другому адресу – SomeDocument.html и так далее. Но php скрипт позволяет обрабатывать данные и только после этого возвращать ответ.
Как отправлять данные с клиента и загружать ответ сервера?
В качестве второго параметра мы можем отправить объект javascript
1 2 3 |
... $('#mydiv').load('ajaxServerAnswer.php', {property1:'someValue1', property2:'someValue2'}); ... |
App.js
1 2 3 4 5 6 7 8 9 |
$(function(){ $('button').on('click',function(){ $('#mydiv').load('ajaxServerAnswer.php',{property1:'someValue1', property2:'someValue2'}); }); // on });// function |
На сервере обработаем таким образом
1 2 3 4 5 6 7 8 9 10 |
<?php $myVar1=$_REQUEST['property1']; $myVar2=$_REQUEST['property2']; echo "<hr/>"."hello it is ajax Answer<br>"."property1= ".$myVar1."<br>"."property2= ".$myVar2."<br>"; echo "I believe"; ?> |
Функция обратного вызова
По завершении функции load, в качестве параметра мы можем вызвать функцию таким образом
1 |
$('#mydiv').load('ajaxServerAnswer.php',{property1:'someValue1', property2:'someValue2'}, function(){alert('Данные загружены');}); |