Неактивная кнопка после выполнения скрипта

[MaxiRush]

Добрый день, друзья. Рылся, рылся я в интернете несколько дней, не помогло. Обращаюсь к Вам: на сайте есть форма обратной связи, но проблема в том, что можно хоть 25 раз нажать оправить - и на почту придет 25 сообщений. Думал, думал как решить, лучшее, что пришло в голову - реализовать через onclick неактивную кнопку(т. е. после одного нажатия кнопка становится неактивной). Однако в таком случае после нажатия кнопка просто становится неактивной, а отправка письма не происходит. Форумчане, помогите хоть советом, что можно сделать.
Сам скрипт

<script>
document.getElementById('feedback-form').onsubmit = function(){
  var http = new XMLHttpRequest();
  http.open("POST", "/contacts.php", true);
  http.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
  http.send("nameFF=" + this.nameFF.value + "&contactFF=" + this.contactFF.value + "&messageFF=" + this.messageFF.value);
  http.onreadystatechange = function() {
    if (http.readyState == 4 && http.status == 200) {
      alert(http.responseText + ', Ваше сообщение получено.\nНаши специалисты ответят Вам в течении 2-х дней.\nБлагодарим за интерес к нашей фирме!');
    }
  }
  http.onerror = function() {
    alert('Извините, данные не были переданы');
  }
  return false;
}
</script>

Форма обратной связи

<form method="POST" id="feedback-form" style="text-align: center">
<input type="text" name="nameFF" required placeholder="Ваше имя" x-autocompletetype="name">
<input type="email" name="contactFF" required placeholder="Email для связи" x-autocompletetype="email">
<textarea name="messageFF" required rows="5" placeholder="Сообщение"></textarea>
<input type="submit" value="Отправить" onclick="this.disabled=true;">
<div  class="social1">
<a href="#" class="goodshare" data-type="vk"> <img src="/bitrix/js/goodshare/icons/vk.png"></a>
<a href="#" class="goodshare" data-type="ok"> <img src="/bitrix/js/goodshare/icons/ok.png"></a>
<a href="#" class="goodshare" data-type="fb"> <img src="/bitrix/js/goodshare/icons/fb.png"></a>
</div>
<div  class="social2">
<a href="#" class="goodshare" data-type="tw"> <img src="/bitrix/js/goodshare/icons/tw.png"></a>
<a href="#" class="goodshare" data-type="gp"> <img src="/bitrix/js/goodshare/icons/gp.png"></a>
<a href="#" class="goodshare" data-type="li"> <img src="/bitrix/js/goodshare/icons/li.png"></a>
</div>
</form>

Файл contacts.php

<?
if (array_key_exists('messageFF', $_POST)) {
mail ("l*******[email protected]",
        "Обращение с сайта ***********",
        "Имя: ".$_POST['nameFF']."\nEmail: ".$_POST['contactFF']."\nСтраница: ".$_SERVER['HTTP_REFERER']."\nСообщение: ".$_POST['messageFF']);
echo $_POST['nameFF'];
}
?>

 

[флоппик]

В большинстве браузеров, кроме ФФ, блокирование кнопки, которая имеет submit-функционал, автоматически останавливает пропагацию события, и сабмита не произойднет.
Вариантов 2:
1. По нажатию задисейблить, и дернуть this.form.submit() руками, что приведет к отправке формы.
2. Дисейблить уже из onsubmit формы. (В подходе из твоего примера может не помочь, ибо аякс)

Нужно учесть, что ФФ зато закеширует дисейбл кнопки, и после F5 отправить форму будет нельзя. Лечится через autocomplete=off

 

[MaxiRush]

Не могли бы Вы первый вариант сопроводить хоть небольшим кодом, чтобы я понимал в какую сторону копать, а то я в этом деле новичок.

 

[Страшный Злодей]

Копайте в сторону директивы: onclick="this.disabled=true;"
имхо, логичнее сделать что-нибудь такое: this.style.display="none"; или такое: this.type="text";

 

[antson]

MaxiRush, лучше сделать проверку в обработчике /contacts.php .
Посмотрите как реализуется обратки в коробочных cms.
Тот код что вы привели ужасен в плане безопасности.

 

[флоппик]

Страшный Злодей, ты вообще читаешь что нибудь, перед тем как писать?
antson, какой обработчик? Нет еще обработки на стороне сервера в этот момент, до него не дошел вызов еще, в том-то и проблема.

 

[antson]

флоппик, исходная проблема . текст может быть отравлен много раз.
причины:
1. Многократное нажатие на кнопку сабмита
2. Прямой вызов скрипта зловредом.

Так зачем их решать по отдельности.
по первому можно добавлять к кнопке класс, который стилизует ее под дизебленную.
И дергать скрипт на сервере уже исходя из наличия / отсутствия класса.
А вот в самом скрипте принимать меры противодействия зафлуживанию почтового ящика.

 

[флоппик]

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

antson, ты тоже тему не читаешь, да?
http://phpclub.ru/talk/members/antson.1192/

 

[Вурдалак]

antson, ты тоже тему не читаешь, да?

А зачем? Больно надо, есть и более интересные дела.

 

[antson]

проблема Однако в таком случае после нажатия кнопка просто становится неактивной, а отправка письма не происходит
возникла из-за неправильного выбора решения реализовать через onclick неактивную кнопку
исходной проблемы можно хоть 25 раз нажать оправить - и на почту придет 25 сообщений
т.е. человеку на самом деле нужен антифлуд
и делать его правильнее в скрипте, который собственно высылает письма, а не в коде формы .