Як уникнути надсилання полів введення, які приховані дисплеєм: жодного на сервер?

88

Уявіть, у вас є форма, де ви перемикаєте видимість кількох полів. І якщо поле не відображається, ви не хочете, щоб його значення було в запиті.

Як ви вирішуєте цю ситуацію?

html http field

— glaz666
джерело

128

Якщо встановити елемент форми у вимкненому стані, він зупинить його перехід на сервер, наприклад:

<input disabled="disabled" type="text" name="test"/>

У javascript це означало б приблизно таке:

var inputs = document.getElementsByTagName('input');
for(var i = 0;i < inputs.length; i++) {
    if(inputs[i].style.display == 'none') {
        inputs[i].disabled = true;
    }
}
document.forms[0].submit();

У jQuery:

   $('form > input:hidden').attr("disabled",true);
   $('form').submit();

— karim79
джерело

16

За допомогою псевдоселектора jQuery :inputзамість цього inputви також можете легко вимкнути всі елементи selectта textareaелементи

— Daniel Rikowski

8

У jQuery> = 1.6, замість attr("disabled", true)вас слід використовувати prop("disabled", true) api.jquery.com/prop

— yorch 07.03.13

2

@ dominicbri7 - Починаючи з jQuery 1.6, використання .prop()замість .attr()рекомендується для отримання І встановлення як відключених, так і перевірених властивостей. Перевірка та налаштування за допомогою .attr()в деяких випадках повертають небажані результати. Будь ласка, прочитайте документацію jQuery, перш ніж коментувати, на що посилався yorch.

— zgr024

@ zgr024 штраф, видалив мій коментар

— dominicbri7

2

@DanielRikowski, Що з цим jQuery тут jQuery там нісенітниця. Давайте поговоримо Vanilla JS.

— Pacerier

13

Ви можете використовувати javascript для встановлення відключеного атрибута. Подія натискання кнопки "Надіслати", мабуть, найкраще місце для цього.

Однак я б радив взагалі не робити цього. Якщо можливо, вам слід відфільтрувати ваш запит на сервері. Це буде надійніше.

— Бенедикт Коен
джерело

7

Якщо ви хочете вимкнути всі елементи або певні елементи в прихованому батьківському елементі, ви можете використовувати

$("div").filter(":hidden").children("input[type='text']").attr("disabled", "disabled");

Цей приклад http://jsfiddle.net/gKsTS/ вимикає всі текстові поля в прихованому div

— маціо.черв
джерело

Це дуже хороше рішення, яке перебирає прихований div і відключає всі. він повинен отримати більше +1

— yeppe

6

Що стосовно:

$('#divID').children(":input").prop("disabled", true); // disable

і

$('#divID').children(":input").prop("disabled", false); // enable

Щоб перемикати всі дочірні введення (вибирає, прапорці, введення, текстові області тощо) всередині прихованого div.

— Антоніо Макс
джерело

Це чудове рішення, якщо ви хочете отримати всі вхідні дані. хороша робота

— doz87

3

Одним дуже простим (але не завжди найзручнішим) рішенням є видалення атрибута "name" - стандарт вимагає, щоб браузери не надсилали неназвані значення, і всі браузери, яких я знаю, дотримуються цього правила.

— джсалвата
джерело

4

Не рекомендується, оскільки якщо ви змінюєте стан через javascript, ви навряд чи можете скинути вводи, не кешуючи всі атрибути імені. Набагато простіше переключити інвалідний стан.

— Саймон

1

Я б або видалив значення з вводу, або від'єднав вхідний об'єкт від DOM, щоб воно не існувало для розміщення спочатку.

— JMP
джерело