Остановить поле ввода в форме от отправки - PullRequest
Новая
       9

Остановить поле ввода в форме от отправки

103 голосов
/ 09 июня 2010

Я пишу некоторый javascript (greasemonkey / userscript), который вставит некоторые поля ввода в форму на веб-сайте.

Дело в том, что я не хочу, чтобы эти поля ввода каким-либо образом влияли на форму, я не хочу, чтобы они отправлялись при отправке формы, я только хочу, чтобы мой javascript имел доступ к их значениям.

Можно ли как-то добавить некоторые поля ввода в середину формы и не отправлять их при отправке формы?

Очевидно, что идеальным вариантом было бы, чтобы поля ввода не были в элементе формы, но я хочу, чтобы макет моей получившейся страницы отображал мои вставленные поля ввода между элементами исходной формы.

Ответы [ 11 ]

146 голосов
/ 09 июня 2010

Вы можете вставить поля ввода без атрибута "name": 

<input type="text" id="in-between" />

Или вы можете просто удалить их после отправки формы (в jquery): 

$("form").submit(function() {

   $(this).children('#in-between').remove();

});
50 голосов
/ 09 июня 2010

Самое простое, что можно сделать, это вставить элементы с атрибутом disabled. 

<input type="hidden" name="not_gonna_submit" disabled="disabled" value="invisible" />

Таким образом, вы все равно сможете получить к ним доступ как к дочерним элементам формы.

Отключеноу полей есть недостаток, что пользователь вообще не может с ними взаимодействовать, поэтому, если у вас есть текстовое поле disabled, пользователь не сможет выделить текст.Если у вас установлен флажок disabled, пользователь не сможет изменить его состояние.

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

10 голосов
/ 28 января 2014

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

<input type="checkbox" checked="" id="class_box_2" value="2">
8 голосов
/ 26 апреля 2017

Я просто хотел добавить дополнительную опцию: в поле ввода добавьте тег формы и укажите имя формы, которой нет на вашей странице: 

<input form="fakeForm" type="text" readonly value="random value" />
8 голосов
/ 09 июня 2010

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

Вот быстрый пример, не прошедший проверку:

var noSubmitElements = [ 'someFormElementID1', 'someFormElementID2' ]; //...
function submitForm() {
    for( var i = 0, j = noSubmitElements.length; i < j; i++ ) {
        document.getElementById(noSubmitElements[i]).removeAttribute('name');
    }
}
form.onsubmit = submitForm;
3 голосов
/ 12 декабря 2016

Добавить disabled = "disabled" во входных данных, и пока jquery удаляет атрибут отключен, если вы хотите отправить его с помощью .removeAttr ('disabled')

HTML:

<input type="hidden" name="test" value="test" disabled='disabled'/>

JQuery:

$("input[name='test']").removeAttr('disabled');

1 голос
/ 30 июля 2013

Я знаю, что это сообщение древнее, но я все равно отвечу. Самый простой / лучший способ, который я нашел, это просто установить имя пустым.

Поставьте это перед отправкой: 

document.getElementById("TheInputsIdHere").name = "";

В целом ваша функция отправки может выглядеть так: 

document.getElementById("TheInputsIdHere").name = "";
document.getElementById("TheFormsIdHere").submit();

Это все равно отправит форму со всеми вашими другими полями, но не отправит форму без имени.

0 голосов
/ 04 декабря 2015

Вам необходимо добавить onsubmit в вашей форме: 

<form action="YOUR_URL" method="post" accept-charset="utf-8" onsubmit="return validateRegisterForm();">

И скрипт будет выглядеть так: 

        function validateRegisterForm(){
        if(SOMETHING IS WRONG)
        { 
            alert("validation failed");
            event.preventDefault();
            return false;

        }else{
            alert("validations passed");
            return true;
        }
    }

Это работает для меня каждый раз:)

0 голосов
/ 21 мая 2015 
$('#serialize').click(function () {
  $('#out').text(
    $('form').serialize()
  );
});

$('#exclude').change(function () {
  if ($(this).is(':checked')) {
    $('[name=age]').attr('form', 'fake-form-id');
  } else {
    $('[name=age]').removeAttr('form');    
  }
  
  $('#serialize').click();
});
0 голосов
/ 09 июня 2010

Вам вообще нужно, чтобы они были элементами ввода? Вы можете использовать Javascript для динамического создания элементов div, абзацев, элементов списка или чего-либо, что содержит информацию, которую вы хотите представить.

Но если интерактивный элемент важен, и размещение этих элементов вне блока <form> затруднительно, то должна быть возможность удалить эти элементы из формы при отправке страницы.

Страница:
...