2013-07-23 7 views
8

Wir derzeit $('form').serialize() verwenden alle FormularinformationenHolen richtigen Wert Checkbox form.serialize

Dadurch kehren alle Kontrollkästchen Werte als „Ein“ oder „Aus“ zu erhalten.

Gibt es eine Möglichkeit, einen 1/0 oder wahr/falsch Wert mit der gleichen Methode zu erhalten?

Antwort

20

Ja. Sie können es tun, indem Sie einen versteckten Eingang mit dem gleichen Namen wie Checkbox hinzugefügt, der Wert vorgelegt werden, wenn Checkbox deaktiviert ist:

<input type="hidden" name="option" value="false"/> 
<input type="checkbox" name="option" value="true"/> 

Es wird beide Werte einreichen, wenn Kontrollkästchen aktiviert ist. Aber Server-Seite wird die neueste (Wert des Kontrollkästchens) lesen

+1

Wenn Sie viele Kontrollkästchen haben, kann diese Methode unhandlich werden. Hier ist ein besserer Ansatz: http://StackOverflow.com/a/7108685/399435 –

+0

Absolut nicht mit dir stimmen @KarthicRaghupathi. Wenn ein mehrzeiliger benutzerdefinierter JS mit nicht transparenter Logik für Sie "wendiger" aussieht, gehen Sie einfach dafür. Die ursprüngliche Frage betraf binäre Werte, nicht mehrere. Für mich - zwei Zeilen HTML Code ist eine viel elegantere Lösung. – roody

+0

der andere Ansatz ist auch für Binärwerte. Nur es behandelt alle Kontrollkästchen im Formular. Ich musste 20 Checkboxen in einem Formular bearbeiten. Ihre Vorgehensweise bedeutet 40 Eingabe-Tags im Gegensatz zu wenigen Zeilen von JS. –

0

Der Wert eines Formular-Steuerelements ist immer eine Zeichenfolge. Sie können Optionsschaltflächen verwenden, um verschiedene Werte für den gleichen Steuer Namen zu erhalten:

<form ...> 
    <input type="radio" name="whatever" value="true">true 
    <br> 
    <input type="radio" name="whatever" value="false">false 
    ... 
</form> 

Es kann nur ein überprüft werden, und nur der geprüfte Name/Wert wird an den Server gesendet werden.

0
<input type="checkbox" name="check1" value="true" id="check1"> 

setzt nur den Wert

+1

es wird nicht aktualisiert, wenn wir das Kontrollkästchen aktivieren/deaktivieren und benötigt mehr js zu arbeiten – behz4d

0

Wenn wir mehr in unserer Seite wie checkboxed haben:

<input id="reminder" name="Check1" value="false" type="checkbox" /> 

    <input id="alarm" name="Check2" value="false" type="checkbox" /> 

müssen wir das Änderungsereignis dieses Kontrollkästchen, binden und setzten Sie den Wert auf true oder false .

$('input[type=checkbox]').on('change', function(){ 
    var name = $(this).attr('name'); 
    if($(this).is(':checked')){ 
    $('input[name= "' +name +'"]').val(true); 
     $(this).val(true); 
    } 
    else{ 
     $(this).val(false); 
     $('input[name= "' +name +'"]').val(false); 
    } 
}); 

standardmäßig Checkbox Wert erscheint nicht in $ ('Form'). SerializeArray() Es wird angezeigt, wenn es aktiviert ist.

Wir haben für jedes Kästchen ein verstecktes Feld zu halten wie:

<input type="hidden" value="false" name="Check1" /> 
<input type="hidden" value="false" name="Check2" /> 

Nun, wenn wir die Form jetzt serialisiert, bekommen wir den richtigen Wert wie: Check1 = true Check2 = false

0

Sie können eine neue Klasse für Kontrollkästchen hinzufügen und den Wert beim Klicken festlegen.

<input class="checkbox" id="someId" type="checkbox" value="false" />Checkbox 

Und mit einem kleinen JQuery Helfer

$('.checkbox').click(function() { 
    $(this).val() == "false" ? $(this).val("true") : $(this).val("false"); 
}); 

Dann werden Sie in der Lage sein, den Wert des Kontrollkästchens zu erhalten oder um eine Form serialisiert.