Devre dışı bırakılmış bir Giriş Onay Kutusu nasıl POST / Gönderilir?

Belirli koşullar altında devre dışı bırakılması gereken bir onay kutum var. HTTP'nin devre dışı bırakılmış girişleri göndermediği ortaya çıktı.

Bunu nasıl aşabilirim? girişi devre dışı bırakılmış olsa bile gönderiyor ve girişi devre dışı bırakıyor mu?

GÜNCELLEME : READONLYonay kutularında çalışmaz

Kullanabilirsiniz, disabled="disabled"ancak bu noktada onay kutusunun değeri POSTdeğerlerde görünmeyecektir . Stratejilerden biri, onay kutusunun değerini aynı form içinde tutan gizli bir alan eklemek ve değeri o alandan geri okumaktır.

Basitçe değiştirmek disablediçinreadonly

Bu sorunu çözdüm.

Yana readonly="readonly"etiketi (Ben farklı tarayıcılar denedim) çalışmıyor, kullanmak zorunda disabled="disabled" yerine. Ancak onay kutunuzun değeri o zaman gönderilmez ...

İşte benim çözümüm:

Almak için "salt okunur" bir görünüm ve POST aynı zamanda onay kutusunu değeri, sadece onay kutusunu aynı ad ve değer ile bir gizli "girdi" add . Onay kutunuzun yanında veya aynı <form></form>etiketlerin arasında tutmanız gerekir :

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

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

Ayrıca, sadece size bildirmek için readonly="readonly", readonly="true", readonly="",ya da READONLYbunu çözmeyecek! Çözmek için birkaç saat harcadım!

Bu referans aynı zamanda ilgili DEĞİLDİR (henüz olmayabilir veya artık hiçbir fikrim yok): http://www.w3schools.com/tags/att_input_readonly.asp

JQuery'yi kullanmaktan memnunsanız, formu gönderirken devre dışı bırakılan özelliği kaldırın:

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

Bunu şu şekilde halledebilirsiniz ... Her onay kutusu için aynı nameözelliğe sahip gizli bir alan oluşturun . Ancak bu gizli alanın değerini, test edebileceğiniz bazı varsayılan değerlerle ayarlayın. Örneğin..

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

Form gönderildiğinde onay kutusu "işaretliyse", bu form parametresinin değeri

"agree,false"

Onay kutusu işaretlenmemişse, değer

"false"

"Yanlış" yerine herhangi bir değeri kullanabilirsiniz, ancak fikri anladınız.

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

Sorundan başladım: "Devre dışı bırakılan bir Giriş Onay Kutusu nasıl POST / Gönderilir?" ve cevabımda şu yorumu atladım: "Bir onay kutusunu devre dışı bırakmak istiyorsak, mutlaka önekli bir değer (işaretli veya işaretsiz) tutmamız gerekir ve ayrıca kullanıcının bunun farkında olmasını isteriz (aksi takdirde gizli bir tür kullanmalıyız ve bir onay kutusu değil) ". Cevabımda her zaman bir onay kutusunu işaretli tutmak istediğimizi ve bu kodun bu şekilde çalıştığını varsayıyorum. Bu onay kutusuna tıklarsak, sonsuza kadar kontrol edilecek ve değeri POSTED / Gönderilecek! Aynı şekilde, onclick = "this.checked = false" yazarsam işaretli = "işaretli" (not: varsayılan işaretli değildir) sonsuza kadar işaretlenmeyecek ve değeri YAYINLANMAYACAK / Gönderilmeyecektir !.

bir css sınıfı oluşturun, örneğin:

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

devre dışı bırakılmış öznitelik yerine bu sınıfı uygula

Bunun en basit yolu şudur:

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

Bu, kullanıcının bu onay kutusunun seçimini kaldırmasını engelleyecek ve form gönderildiğinde de değerini göndermeye devam edecektir. Kullanıcının bu onay kutusunu seçememesini istiyorsanız Kaldır işaretli.

Ayrıca, belirli bir koşul karşılandığında onclick'i temizlemek için javascript kullanabilirsiniz (peşinde olduğunuz şey buysa). İşte ne demek istediğimi gösteren hüzünlü bir keman. Mükemmel değil, ama özü anladın.

http://jsfiddle.net/vwUUc/

Bu bir cazibe gibi çalışıyor:

1. Kaldırmak"Devre dışı bırakılan" öznitelikleri
2. Sunmak formunu
3. Öznitelikleri tekrar ekleyin . Bunu yapmanın en iyi yolu , örneğin 1 milisaniye gecikmeli bir setTimeOut işlevi kullanmaktır .

Tek dezavantaj, gönderirken devre dışı bırakılan giriş alanlarının kısa süre yanıp sönmesidir. En azından benim senaryomda bu pek sorun değil!

$('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);

});

Devre dışı bırakmayın; bunun yerine salt okunur olarak ayarlayın, ancak bunun kullanıcının durumu değiştirmesine izin vermeme açısından hiçbir etkisi yoktur. Ancak bunu zorunlu kılmak için jQuery'yi kullanabilirsiniz (kullanıcının onay kutusunun durumunu değiştirmesini önleyin:

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

Bu, değiştirilmesini istemediğiniz tüm onay kutularının "salt okunur" özelliğine sahip olduğunu varsayar. Örneğin.

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

Dan beri:

• salt okunur özniteliğini onay kutusuna ayarlamak HTML spesifikasyonuna göre geçerli değil,
• Değer göndermek için gizli öğeyi kullanmak pek hoş bir yol değildir ve
• değerin değişmesini engelleyen onclick JavaScript'i ayarlamak da çok hoş değil

Size başka bir olasılık sunacağım:

Onay kutunuzu normal şekilde devre dışı olarak ayarlayın. Form kullanıcı tarafından gönderilmeden önce bu onay kutusunu JavaScript ile etkinleştirin.

<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>

Onay kutusu form gönderilmeden önce etkinleştirildiğinden, değeri ortak bir şekilde gönderilir. Bu çözümle ilgili pek hoş olmayan tek şey, bu onay kutusunun bir süreliğine etkin hale gelmesi ve kullanıcılar tarafından görülebilmesidir. Ama bu yaşayabileceğim bir ayrıntı.

Maalesef 'basit' bir çözüm yok. Salt okunur özniteliği onay kutularına uygulanamaz. Onay kutusu hakkındaki W3 spesifikasyonunu okudum ve suçlu buldum:

Form gönderildiğinde bir denetimin geçerli bir değeri yoksa, kullanıcı aracılarının bunu başarılı bir denetim olarak ele alması gerekmez. ( http://www.w3.org/TR/html401/interact/forms.html#h-17.13.2 )

Bu, denetlenmemiş durumun ve devre dışı bırakılmış durumun aynı çözümlenmiş değerle sonuçlanmasına neden olur.

• readonly = "salt okunur" onay kutuları için geçerli bir öznitelik değildir.
• Onclick = "event.preventDefault ();" onay kutusunun üzerinde tetiklendiği için her zaman iyi bir çözüm değildir. Ancak bazı durumlarda cazibesi olabilir.
• OnSubmit onay kutusunun etkinleştirilmesi bir çözüm değildir çünkü kontrol hala başarılı bir kontrol olarak değerlendirilmediği için değer ayrıştırılmayacaktır.
• HTML'nize aynı ada sahip başka bir gizli girdi eklemek işe yaramaz çünkü ilk denetim değeri, aynı ada sahip olduğu için ikinci denetim değerinin üzerine yazılır.

Bunu yapmanın tek tam kanıt yolu , formu gönderirken javascript ile aynı ada sahip gizli bir giriş eklemektir .

Bunun için yaptığım küçük parçacığı kullanabilirsiniz:

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);
    }
  }
}

Bu, belgedeki ilk formu arar, tüm girdileri toplar ve devre dışı bırakılmış girdileri arar. Devre dışı bırakılmış bir girdi bulunduğunda, parentNode'da aynı ada ve 'on' değerine (durumu 'işaretli' ise) ve '' (eğer durumu '' - işaretli değilse) gizli bir girdi oluşturulur.

Bu işlev, aşağıdaki gibi FORM öğesindeki 'onsubmit' olayı tarafından tetiklenmelidir:

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

Forma ekleyin onsubmit="this['*nameofyourcheckbox*'].disabled=false".

Bir hiddenalandan başka seçenek yoktur , bu nedenle hiddenaşağıdaki kodda gösterildiği gibi bir alanı kullanmayı deneyin :

<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>

Bazı_adı işlevi, maddeye göre kontrol edilen (değerini gönderen) veya işaretlenmeyen (değerini göndermeyen) ikinci onay kutusunu yönetmek için bir önceki cümle örneğidir ve kullanıcı durumunu değiştiremez; ikinci onay kutusunun devre dışı bırakılmasının yönetilmesine gerek yoktur

İstediğiniz gibi devre dışı bırakabilir ve ardından form gönderilmeden önce devre dışı bırakılan özelliği kaldırabilirsiniz.

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

Sorunumu onclick="this.checked=true"çöz:
Örnek:

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

İşte arka uçtan kontrol edilebilecek başka bir çalışma.

ASPX

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

ASPX.CS'de

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

Sınıf yalnızca stil amacıyla eklenir.

HTML, JS ve CSS önerilerini buradaki yanıtlarda birleştirdim

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;
}

Öğe "devre dışı" olmadığından, yine de POST'tan geçer.