як встановити / подати прапорець для введення, який вимкнено?

У мене є прапорець, який за певних умов потрібно вимкнути. Виявляється, HTTP не публікує відключені входи.

Як я можу обійти це? подання вводу, навіть якщо його вимкнено і збереження введення вимкнено?

ОНОВЛЕННЯ : READONLYне працює на прапорцях

Ви можете використовувати, disabled="disabled"але в цей момент значення прапорця не відображатиметься у POSTзначеннях. Однією із стратегій є додавання прихованого поля, яке містить значення прапорця в тій же формі, і зчитування значення назад з цього поля

Просто змініть disabledнаreadonly

Я вирішив цю проблему.

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

Ось моє рішення:

Щоб отримати вигляд "лише для читання" і значення прапорця POST за один і той же час, просто додайте прихований "вхід" з тим же ім'ям і значенням, що і ваш прапорець . Ви повинні тримати його поруч зі своїм прапором або між тими ж <form></form>тегами:

<input type="checkbox" checked="checked" disabled="disabled" name="Tests" value="4">SOME TEXT</input>

<input type="hidden" id="Tests" name="Tests" value="4" />

Крім того, просто, щоб ви знали, readonly="readonly", readonly="true", readonly="",або просто READONLYНЕ будете вирішувати це! Я витратив кілька годин, щоб це зрозуміти!

Ця посилання також НЕ актуальна (може бути ще ні, чи ні більше, я поняття не маю): http://www.w3schools.com/tags/att_input_readonly.asp

Якщо ви раді використовувати JQuery, видаліть відключений атрибут під час подання форми:

$("form").submit(function() {
    $("input").removeAttr("disabled");
});

Ви можете це впоратися таким чином ... Для кожного прапорця створіть приховане поле з тим самим nameатрибутом. Але встановіть значення цього прихованого поля деяким значенням за замовчуванням, на яке ви можете протестувати. Наприклад..

<input type="checkbox" name="myCheckbox" value="agree" />
<input type="hidden" name="myCheckbox" value="false" />

Якщо під час подання форми прапорець буде встановлений "прапорець", значення цього параметра буде

"agree,false"

Якщо прапорець не встановлений, значення буде таким

"false"

Ви можете використовувати будь-яке значення замість "false", але ви отримуєте ідею.

<input type="checkbox" checked="checked" onclick="this.checked=true" />

Я почав із проблеми: "як розмістити / подати прапорець для введення, який вимкнено?" і у своїй відповіді я пропустив коментар: "Якщо ми хочемо відключити прапорець, нам, безумовно, потрібно зберігати префіксоване значення (поставлене або невірно), а також ми хочемо, щоб користувач знав про це (інакше ми повинні використовувати прихований тип і не прапорець) ". У своїй відповіді я припускав, що ми хочемо завжди мати прапорець, і цей код працює таким чином. Якщо ми натиснемо на цей ckeckbox, він буде вічно перевірений і його значення буде POSTED / Submitted! Точно так само, якщо я напишу onclick = "this. checked = false" без галочки = "перевірено" (зауважте: за замовчуванням не встановлено прапорці), це буде невірно перевірено, і його значення не буде POSTED / Submitted !.

створити клас css, наприклад:

.disable{
        pointer-events: none;
        opacity: 0.5;
}

застосувати цей клас замість атрибута вимкнено

Найпростіший спосіб до цього:

<input type="checkbox" class="special" onclick="event.preventDefault();" checked />

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

Крім того, ви можете використовувати javascript, щоб очистити onclick після того, як буде виконано певну умову (якщо ви це дотримуєтесь). Ось пустий і брудний загадку, що показує, про що я. Це не ідеально, але ви отримуєте суть.

http://jsfiddle.net/vwUUc/

Це працює як шарм:

1. Видаліть атрибути "вимкнено"
2. Надішліть форму
3. Додайте атрибути ще раз. Найкращий спосіб зробити це - використовувати функцію setTimeOut , наприклад, із затримкою в 1 мілісекунд.

Єдиним недоліком є ​​коротке миготіння відключених полів введення під час надсилання. Принаймні, в моєму сценарії це не велика проблема!

$('form').bind('submit', function () {
  var $inputs = $(this).find(':input'),
      disabledInputs = [],
      $curInput;

  // remove attributes
  for (var i = 0; i < $inputs.length; i++) {
    $curInput = $($inputs[i]);

    if ($curInput.attr('disabled') !== undefined) {
      $curInput.removeAttr('disabled');
      disabledInputs.push(true);
    } else 
      disabledInputs.push(false);
  }

  // add attributes
  setTimeout(function() {
    for (var i = 0; i < $inputs.length; i++) {

      if (disabledInputs[i] === true)
        $($inputs[i]).attr('disabled', true);

    }
  }, 1);

});

Не відключайте його; замість цього встановіть його лише для читання, хоча це не впливає на те, що не дозволяє користувачеві змінювати стан. Але ви можете використовувати jQuery для забезпечення цього (не дозволяйте користувачеві змінювати стан прапорця:

$('input[type="checkbox"][readonly="readonly"]').click(function(e){
    e.preventDefault();
});

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

<input type="checkbox" readonly="readonly">

З моменту:

• встановлення атрибута "readonly" для прапорця недійсне відповідно до специфікації HTML,
• використання прихованого елемента для подання значення не дуже гарний спосіб і
• встановлення onclick JavaScript, що не дозволяє змінювати значення, теж не дуже приємно

Я запропоную вам ще одну можливість:

Установіть прапорець як відключений як звичайний. Перед тим, як користувач подає форму, увімкніть цей прапорець JavaScript.

<script>
    function beforeSumbit() {
        var checkbox = document.getElementById('disabledCheckbox');
        checkbox.disabled = false;
    }
</script>
...
<form action="myAction.do" method="post" onSubmit="javascript: beforeSubmit();">
    <checkbox name="checkboxName" value="checkboxValue" disabled="disabled" id="disabledCheckbox" />
    <input type="submit />
</form>

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

На жаль, не існує "простого" рішення. Атрибут лише заздалегідь не можна застосувати до прапорців. Я прочитав специфікацію W3 про прапорець і виявив винуватця:

Якщо елемент керування не має поточного значення під час подання форми, користувацькі агенти не зобов'язані трактувати його як успішний контроль. ( http://www.w3.org/TR/html401/interact/forms.html#h-17.13.2 )

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

• readonly = "readonly" не є дійсним атрибутом для прапорців.
• onclick = "event.preventDefault ();" не завжди є хорошим рішенням, оскільки воно спрацьовує у самій прапорці. Але це може спрацювати принади в деяких випадках.
• Увімкнення прапорця onSubmit не є рішенням, оскільки контроль досі не трактується як вдалий елемент керування, тому значення не буде розбиратися.
• Додавання ще одного прихованого вводу з тим самим іменем у вашому HTML не працює, оскільки перше керуюче значення перезаписується другим контрольним значенням, оскільки воно має те саме ім'я.

Єдиний повний доказ спосіб зробити це - додати прихований вхід з тим самим іменем за допомогою javascript після подання форми .

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

function disabled_checkbox() {
  var theform = document.forms[0];
  var theinputs = theform.getElementsByTagName('input');
  var nrofinputs = theinputs.length;
  for(var inputnr=0;inputnr<nrofinputs;inputnr++) {
    if(theinputs[inputnr].disabled==true) {
      var thevalueis = theinputs[inputnr].checked==true?"on":"";
      var thehiddeninput = document.createElement("input");
      thehiddeninput.setAttribute("type","hidden");
      thehiddeninput.setAttribute("name",theinputs[inputnr].name);
      thehiddeninput.setAttribute("value",thevalueis);
      theinputs[inputnr].parentNode.appendChild(thehiddeninput);
    }
  }
}

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

Ця функція повинна бути спровокована подією 'onsubmit' в елементі FORM як:

<form id='ID' action='ACTION' onsubmit='disabled_checkbox();'>

Додайте onsubmit="this['*nameofyourcheckbox*'].disabled=false"до форми.

Іншого варіанту, крім hiddenполя, немає, тому спробуйте використовувати hiddenполе, як показано в наведеному нижче коді:

<input type="hidden" type="text" name="chk1[]" id="tasks" value="xyz" >
<input class="display_checkbox" type="checkbox" name="chk1[]" id="tasks" value="xyz" checked="check"  disabled="disabled" >Tasks

<html>
    <head>
    <script type="text/javascript">
    function some_name() {if (document.getElementById('first').checked)      document.getElementById('second').checked=false; else document.getElementById('second').checked=true;} 
    </script>
    </head>
    <body onload="some_name();">
    <form>
    <input type="checkbox" id="first" value="first" onclick="some_name();"/>first<br/>
    <input type="checkbox" id="second" value="second" onclick="some_name();" />second
    </form>
    </body>
</html>

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

Ви можете залишити його відключеним за бажанням, а потім видалити відключений атрибут перед надсиланням форми.

$('#myForm').submit(function() {
    $('checkbox').removeAttr('disabled');
});

Додавання onclick="this.checked=true"Вирішіть мою проблему:
Приклад:

<input type="checkbox" id="scales" name="feature[]" value="scales" checked="checked" onclick="this.checked=true" />

Ось ще одна робота навколо може бути керована з бекенда.

ASPX

<asp:CheckBox ID="Parts_Return_Yes" runat="server" AutoPostBack="false" />

В ASPX.CS

Parts_Return_Yes.InputAttributes["disabled"] = "disabled";
Parts_Return_Yes.InputAttributes["class"] = "disabled-checkbox";

Клас додається лише для стильових цілей.

Я просто поєднав пропозиції HTML, JS та CSS у відповідях тут

HTML:

<input type="checkbox" readonly>

jQuery:

(function(){
    // Raj: https://stackoverflow.com/a/14753503/260665
    $(document).on('click', 'input[type="checkbox"][readonly]', function(e){
        e.preventDefault();
    });
})();

CSS:

input[type="checkbox"][readonly] {
  cursor: not-allowed;
  opacity: 0.5;
}

Оскільки елемент не 'відключений', він все одно проходить через POST.