<input type="submit" name="btnADD" id="btnADD" value="ADD"/>
когда пользователь дважды нажимает кнопку "Добавить", начиная с двухкратной отправки с одинаковыми данными в таблицу. Поэтому, пожалуйста, помогите мне ограничить возможность отправки пользователя дважды.
попробуйте этот код.
<input type="submit" name="btnADD" id="btnADD" value="ADD" onclick="this.disabled=true;this.value='Sending, please wait...';this.form.submit();" />
После отправки формы присоедините обработчик с jQuery, который захватывает и "отключает" обработчик отправки:
var $myForm = $("#my_form");
$myForm.submit(function(){
$myForm.submit(function(){
return false;
});
});
Возврат "false" из обработчика отправки предотвратит отправку формы. Кнопки отключения могут иметь странные последствия для обработки формы. Этот подход, по-видимому, в основном не имеет побочных эффектов и работает даже в формах с несколькими кнопками отправки.
Вы можете отключить кнопку после нажатия или скрыть ее.
<input type="submit" name="btnADD" id="btnADD" value="ADD" onclick="disableButton(this)"/>
js:
function disableButton(button) {
button.disabled = true;
button.value = "submitting...."
button.form.submit();
}
Вы можете уведомить пользователя о том, что он выпивает слишком много кофе, но лучше всего отключить кнопку с помощью javascript, например:
$("#btnADD").on('click', function(btn) {
btn.disabled = true;
});
Если вы работаете со сценариями на стороне сервера Java, а также с помощью struts 2, вы ссылаетесь на эту ссылку, которая говорит об использовании токена.
http://www.xinotes.org/notes/note/369/
Маркер должен быть сгенерирован и сохранен в сеансе для первоначальной рендеринга страницы, когда запрос отправляется вместе с токеном в первый раз, в действии struts запускается поток с именем потока в качестве идентификатора маркера и выполняется логика клиент запросил, когда клиент снова отправит один и тот же запрос, проверьте, продолжает ли поток (thread.getcurrentthread() прерывается), если он еще запущен, а затем отправьте перенаправление клиента 503.
И , если вы не используете какую-либо фреймворк и не ищете простую тренировку. Вы можете воспользоваться
java.util.UUID.randomUUID();
Просто поместите случайный uuid в сеанс, а также в поле скрытой формы и на другой стороне (страница jsp, где вы обрабатываете другую работу, например, хранение данных в базе данных и т.д.) вынимаете uuid из сеанса и скрытой формы, If введите полевые совпадения, чем дальше, удалите uuid из сеанса, и если это возможно, возможно, что форма была повторно отправлена.
Для вашей помощи я пишу фрагмент кода, чтобы дать представление о том, как достичь этой цели.
<%
String formId=(java.util.UUID.randomUUID()).toString();
session.setAttribute(formId,formId);
%>
<input type='hidden' id='formId' name='formId' value='<%=formId%>'>
Я сделал решение, основанное на ответе rogueleaderr:
jQuery('form').submit(function(){
jQuery(this).unbind('submit'); // unbind this submit handler first and ...
jQuery(this).submit(function(){ // added the new submit handler (that does nothing)
return false;
});
console.log('submitting form'); // only for testing purposes
});
Когда пользователь нажимает кнопку отправки, отключите эту кнопку.
<form onSubmit="disable()"></form>
function disable()
{
document.getElementById('submitBtn').disabled = true;
//SUBMIT HERE
}
Вы можете использовать JavaScript.
Прикрепите form.submit.disabled = true; к событию onsubmit формы.
Подкованный пользователь может обойти его, но он должен помешать 99% пользователей отправлять два раза.
Вы можете отобразить успешное сообщение, используя всплывающее окно с кнопкой "ОК", когда нажмите "ОК" переадресовать в другое место
Отключить кнопку отправки
$('#btnADD').attr('disabled','disabled');
or
$('#btnADD').attr('disabled','true');
Создайте класс для формы, в моем случае я использовал: _submitlock
$(document).ready(function () {
$(document).on('submit', '._submitlock', function (event) {
// Check if the form has already been submitted
if (!$(this).hasClass('_submitted')) {
// Mark the form as submitted
$(this).addClass('_submitted');
// Update the attributes of the submit buttons
$(this).find('[type="submit"]').attr('disabled', 'disabled');
// Add classes required to visually change the state of the button
$(this).find('[type="submit"]').addClass("buttoninactive");
$(this).find('[type="submit"]').removeClass("buttonactive");
} else {
// Prevent the submit from occurring.
event.preventDefault();
}
});});
Вы можете добавить класс в свою форму и кнопку отправки и использовать jquery:
$(function() {
// prevent the submit button to be pressed twice
$(".createForm").submit(function() {
$(this).find('.submit').attr('disabled', true);
$(this).find('.submit').text('Sending, please wait...');
});
})Моим решением для подобной проблемы было создание отдельной скрытой кнопки отправки. Это работает так:
onclick вызывает нажатие второй кнопки отправки.<input type="submit" value="Email" onclick="this.disabled=true; this.value='Emailing...'; document.getElementById('submit-button').click();">
<input type="submit" id='submit-button' value="Email" name="btnSubmitSendCertificate" style='display:none;'>
Я пошел по этому пути просто для ясности для других, работающих над кодом. Есть и другие решения, которые могут быть субъективно лучше.
Поместите класс на все ваши кнопки type = "submit", например, "button-disable-onsubmit" и используйте jQuery script следующим образом:
$(function(){
$(".button-disable-onsubmit").click(function(){
$(this).attr("disabled", "disabled");
$(this).closest("form").submit();
});
});
Не забудьте сохранить этот код в общем файле javascript, чтобы вы могли использовать его на многих страницах. Подобно этому, он становится элегантным и простым в использовании. Кроме того, вы можете добавить еще одну строку, чтобы изменить текстовое значение:
$(this).val("Sending, please wait.");
Добавить класс в форму при отправке, остановить двойное нажатие/отправку пользователем
$('form[method=post]').each(function(){
$(this).submit(function(form_submission) {
if($(form_submission.target).attr('data-submitted')){
form_submission.preventDefault();
}else{
$(form_submission.target).attr('data-submitted', true);
}
});
});
Это старый вопрос, но у меня была проблема с моей формой, на которую нет ответа, и я подумал, что это может быть полезно, так как я подозреваю, что это общая проблема.
Я использую в своих формах jQuery validate, и если пользователь пытается отправить форму, но внешний интерфейс не позволяет отправить форму, кнопка отправки по-прежнему отключена, что означает, что пользователь не может отправить форму.
Разобравшись с отличным ответом rogueleaderr, я добавил быструю проверку, чтобы убедиться, что перед отключением повторной отправки формы не было никаких сообщений об ошибках переднего плана:
<script>
$(document).ready(function () {
var $myForm = $("#My-Form-Class");
$myForm.submit(function(){
if ($(".Front-End-Error-Class")[0]){
console.log("Front End error messages are present - don't submit");
}
else{
$myForm.submit(function(){
return false;
});
}
});
});
</script><script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>