|
|
|
| Имеется форма отправки (упрощённо):
<div id="output"></div>
<form id="myForm" action="form.php" method="post">
<table>
<tr>
<td><input type="radio" name="vote" value="-5"></td>
</tr>
<tr>
<td align='center'>+5</td>
</tr>
</table>
<input id="submit" type="submit" name="submit" value="Submit" />
</form>
|
При помощи ajax-запроса ( jquery) она отправляется на сервер и возвращается ответ (писал не я, нашёл в инете).
$(document).ready(function(){
var options = {
target: "#output",
beforeSubmit: showRequest,
success: showResponse,
timeout: 3000
};
$('#myForm').submit(function() {
$(this).ajaxSubmit(options);
return false;
});
});
function showRequest(formData, jqForm, options) {
var queryString = $.param(formData);
return true;
}
function showResponse(responseText, statusText) {
}
|
Вот так вот всё работает.
Помогите сделать следующее:
1. Нужно отправлять форму по onclick (не кнопкой);
2. Во время запроса вывести ajax-каритнку;
3. При ответе от сервера форму скрыть (чтоб больше не голосовали).
4. Нужно сделать проверку по кукам на исключение повторного голосования.
Ребят, очень прошу, объясните проще, т.к. в JS абсолютный ноль.
Заранее спасибо! | |
|
|
|
|
|
|
|
для: netas
(13.07.2010 в 11:36)
| | Начнём с того, что библиотека JQuery предоставляет более простой способ для работы с AJAX-запросами (как раз для Вас):
$.post(url, data, success)
|
url - php-скрипт для обработки данных
data - сами данные
success - функция, вызываемая при успешном выполнении AJAX-запроса.
Поэтому, я бы на Вашем месте использовал такой метод вместо того, что Вы нашли в Интернете.
>При ответе от сервера форму скрыть (чтоб больше не голосовали).
Это лучше всего проверить на сервере, поэтому Вам на форум PHP ;-)
Ну а в самом простом виде это будет выглядеть примерно так:
<form id="myForm" onsubmit="return false;">
...форма...
<input id="submit" type="submit" value="Submit" onclick='sendData();' />
</form>
<div id='loading'>
...контейнер для картинки...
</div>
<script>
//проверяем cookie
if (document.cookie == 'voteOff') { $('#myForm').hide(); }
function sendData() {
var success = function(answ) {
//эта функция выполнится, когда AJAX-запрос будет выполнен;
//скрываем картинку
$('#loading').css('background', 'none');
//скрываем форму
$('#myForm').hide();
//сохраняем cookie
document.cookie = 'voteOff';
}
//посылаем запрос
$.post('form.php', 'vote=' + USER_VOTE, success);
//показываем картинку загрузки
$('#loading').css('background', 'url("ajaxloader.gif")');
}
</script>
|
За картинками Вам сюда - http://ajaxload.info/ | |
|
|
|