POST deaktivierte HTML-Kontrollkästchen

303

Ich habe eine Menge Kontrollkästchen, die standardmäßig aktiviert sind. Meine Benutzer werden wahrscheinlich einige (falls vorhanden) der Kontrollkästchen deaktivieren und den Rest aktiviert lassen.

Gibt es eine Möglichkeit, das Formular POST zu den Kontrollkästchen zu machen, die nicht aktiviert sind, und nicht zu den Kontrollkästchen, die aktiviert sind ?

Reach4thelasers
quelle

Antworten:

217

Fügen Sie eine versteckte Eingabe für das Kontrollkästchen mit einer anderen ID hinzu:

<input id='testName' type='checkbox' value='Yes' name='testName'>
<input id='testNameHidden' type='hidden' value='No' name='testName'>

Deaktivieren Sie vor dem Absenden des Formulars die ausgeblendete Eingabe basierend auf der aktivierten Bedingung:

if(document.getElementById("testName").checked) {
    document.getElementById('testNameHidden').disabled = true;
}
vishnu
quelle
58
Wenn Sie sich für eine Markup-basierte Lösung wie diese entscheiden, ist es wahrscheinlich besser, die versteckte Eingabe an erster Stelle zu setzen, und zwar bei vielen anderen Antworten. Wenn Sie PHP verwenden, können Sie die Javascript-Abhängigkeit beseitigen, da nur der letzte Wert verwendet wird.
Ben
12
Gamov, Sie irren sich, Beschriftungen werden an Eingaben angehängt, die auf dem Attribut id basieren, nicht auf dem Attribut input name
Justin Emery
14
Kaum zu glauben, dass Autoren es so gestaltet haben. Warum nicht alle Eingabefelder mit einem Standardwert für diejenigen senden, die nicht aktiviert sind :( Es wäre eine viel klarere Lösung, als einige versteckte Felder "hack" implementieren zu müssen. Es muss klar gewesen sein, dass es benötigt wird und sie mussten sehen Sie das im Voraus.
Srneczek
34
Das fühlt sich so hackig an.
EralpB
65
Bin ich der einzige, der denkt, dass das zugrunde liegende Design des checkboxElements schrecklich ist? Sie sind eine binäre Steuerung, sie sollten binäre Werte senden.
Alexw
474

Die Lösung, die mir bisher am besten gefallen hat, besteht darin, eine versteckte Eingabe mit demselben Namen wie das Kontrollkästchen einzufügen, die möglicherweise nicht aktiviert ist. Ich denke, es funktioniert so, dass, wenn das Kontrollkästchen nicht aktiviert ist, die versteckte Eingabe immer noch erfolgreich ist und an den Server gesendet wird. Wenn das Kontrollkästchen aktiviert ist, wird die versteckte Eingabe davor überschrieben. Auf diese Weise müssen Sie nicht verfolgen, welche Werte in den veröffentlichten Daten voraussichtlich von Kontrollkästchen stammen.

<form>
  <input type='hidden' value='0' name='selfdestruct'>
  <input type='checkbox' value='1' name='selfdestruct'>
</form>
Sam
quelle
3
Nachdem ich die Frage noch einmal gelesen habe, scheint dies nicht wirklich das zu sein, was Sie wollten. Ich kam jedoch zu dieser Frage, als ich versuchte, diese Antwort herauszufinden, damit sie vielleicht für jemand anderen nützlich sein könnte.
Sam
2
.NET ist anders, stattdessen siehe stackoverflow.com/questions/7600817/…
KCD
121
Wenn Sie das Kontrollkästchen aktivieren, sendet der Browser sowohl die ausgeblendeten als auch die Kontrollkästchenwerte. Diese Lösung basiert dann auf der Behandlung der Post-Variablen durch den Server mit diesen beiden Werten. Wenn nur der letzte Wert (z. B. PHP) verwendet wird, funktioniert Ihr Code wie erwartet. Einige Server behandeln dies jedoch anders. Einige wählen den ersten Wert aus, während andere beide Werte in eine Liste / ein Array einfügen.
Michael Ekoka
1
Diese Antwort basiert auf der Annahme, dass Sie nur eine von zwei gleichnamigen Eingaben weiterleiten können, die an den Server gesendet werden. Ich verstehe nicht, warum dies so viele Up-Votes erhalten hat.
Muleskinner
7
@sam weiß nicht, woher du diese Idee hast? Wenn zwei oder mehr Steuerelemente den gleichen Namen haben, werden beide beim Senden an den Server gesendet (für Kontrollkästchen jedoch nur, wenn sie aktiviert sind). Wie sie auf dem Server behandelt werden, hängt von der serverseitigen Implementierung ab. Wenn Sie mir nicht glauben, können Sie sich selbst davon überzeugen, indem Sie den Verkehr mit einem Tool wie Fiddler überwachen.
Muleskinner
75

Ich habe es mit Vanille-JavaScript gelöst:

<input type="hidden" name="checkboxName" value="0"><input type="checkbox" onclick="this.previousSibling.value=1-this.previousSibling.value">

Achten Sie darauf, dass zwischen diesen beiden Eingabeelementen keine Leerzeichen oder Zeilenumbrüche auftreten!

Sie können verwenden this.previousSibling.previousSibling, um "obere" Elemente zu erhalten.

Mit PHP können Sie das benannte versteckte Feld auf 0 (nicht gesetzt) ​​oder 1 (gesetzt) ​​überprüfen.

Marcel Ennix
quelle
Warum können zwischen den beiden Elementen keine Leerzeichen oder Zeilenumbrüche stehen?
Michael Potter
@MichaelPotter: this.previousSibling erhält Leerzeichen als Geschwister, sodass es nicht funktioniert.
Marcel Ennix
4
Oh das ist perfekt! Es löst das Problem, mehrere Feldsätze mit doppelt benannten Feldern dort zu veröffentlichen. Keine der anderen Lösungen tut dies. Mit der Marcel-Methode haben Ihre geposteten Felder Arrays gleicher Länge. Also dieses Szenario: <fieldset name='fs1'> <input type="text" name="somefield[]"> <input type="checkbox" name="live[]"> </fieldset> <fieldset name='fs2'> <input type="text" name="somefield[]"> <input type="checkbox" name="live[]"> </fieldset>* Angenommen, es gab dort neue Zeilen. Sie scheinen nicht in Mini-Markup-Codeblöcken zu arbeiten
Brian Layman
1
Dies sollte die akzeptierte Antwort sein. Es funktioniert mit Arrays (ex / name = "
oup
2
Sie können previousElementSiblinganstelle von verwenden previousSibling. Es wird fast überall unterstützt und ignoriert Textknoten.
MarSoft
23

Mein persönlicher Favorit ist das Hinzufügen eines ausgeblendeten Feldes mit demselben Namen, das verwendet wird, wenn das Kontrollkästchen deaktiviert ist. Aber die Lösung ist nicht so einfach, wie es scheint.

Wenn Sie diesen Code hinzufügen:

<form>
  <input type='hidden' value='0' name='selfdestruct'>
  <input type='checkbox' value='1' name='selfdestruct'>
</form>

Dem Browser ist es egal, was Sie hier tun. Der Browser sendet beide Parameter an den Server, und der Server muss entscheiden, was mit ihnen geschehen soll.

PHP verwendet beispielsweise den letzten zu verwendenden Wert (siehe: Autorisierende Position doppelter HTTP-GET-Abfrageschlüssel )

Aber andere Systeme, mit denen ich gearbeitet habe (basierend auf Java), machen es umgekehrt - sie bieten Ihnen nur den ersten Wert. Stattdessen erhalten Sie mit .NET ein Array mit beiden Elementen

Ich werde versuchen, dies irgendwann mit node.js, Python und Perl zu testen.

SimonSimCity
quelle
2
ruby und node.js nehmen beide den letzten Wert aller duplizierten Formularfelder an. Aus diesem Grund erstellen die Hilfsmethoden von Ruby on Rails auf diese Weise Kontrollkästchen.
Nzifnab
7
Um das abzurunden - dies basiert auf einem Angriff namens HTTP Parameter Pollution und wurde von OWASP analysiert: owasp.org/images/b/ba/AppsecEU09_CarettoniDiPaola_v0.8.pdf (Seite 9), wo Sie eine Liste von 20 finden Systeme Systeme und sehen, wie sie damit umgehen.
SimonSimCity
1
Java Servlets gibt Ihnen alles, solange Sie anrufenrequest.getParameterValues
Mauhiz
20

Eine übliche Technik besteht darin, eine versteckte Variable zusammen mit jedem Kontrollkästchen zu tragen.

<input type="checkbox" name="mycheckbox" />
<input type="hidden" name="mycheckbox.hidden"/>

Auf der Serverseite erkennen wir zuerst eine Liste versteckter Variablen und versuchen für jede versteckte Variable zu prüfen, ob der entsprechende Kontrollkästcheneintrag in den Formulardaten gesendet wird oder nicht.

Der serverseitige Algorithmus würde wahrscheinlich folgendermaßen aussehen:

for input in form data such that input.name endswith .hidden
  checkboxName = input.name.rstrip('.hidden')
  if chceckbName is not in form, user has unchecked this checkbox

Das Obige beantwortet die Frage nicht genau, bietet jedoch ein alternatives Mittel, um ähnliche Funktionen zu erreichen.

Shailesh Kumar
quelle
20

Sie müssen nicht für alle Kontrollkästchen ein verstecktes Feld erstellen, sondern nur meinen Code kopieren. es wird den Wert der Option ändern , wenn nicht der überprüft valuewird zuweisen 0und wenn Checkbox dann assign geprüft valuein1

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

    var this_master = $(this);

    this_master.find('input[type="checkbox"]').each( function () {
        var checkbox_this = $(this);


        if( checkbox_this.is(":checked") == true ) {
            checkbox_this.attr('value','1');
        } else {
            checkbox_this.prop('checked',true);
            //DONT' ITS JUST CHECK THE CHECKBOX TO SUBMIT FORM DATA    
            checkbox_this.attr('value','0');
        }
    })
})
Rameez SOOMRO
quelle
1
Diese Lösung funktioniert gut und eleganter als Dom mit versteckten Feldern zu verschmutzen.
Prasad Paranjape
9
Dadurch wird das Kontrollkästchen vorübergehend aktiviert, während das Formular gesendet wird. Dies ist (bestenfalls) für den Benutzer verwirrend.
Mark Fraser
12
$('input[type=checkbox]').on("change",function(){
    var target = $(this).parent().find('input[type=hidden]').val();
    if(target == 0)
    {
        target = 1;
    }
    else
    {
        target = 0;
    }
    $(this).parent().find('input[type=hidden]').val(target);
});

<p>
    <input type="checkbox" />
    <input type="hidden" name="test_checkbox[]" value="0" />
</p>
<p>
    <input type="checkbox" />
    <input type="hidden" name="test_checkbox[]" value="0" />
</p>
<p>
    <input type="checkbox" />
    <input type="hidden" name="test_checkbox[]" value="0" />
</p>

Wenn Sie den Namen des Kontrollkästchens weglassen, wird es nicht übergeben. Nur das Array test_checkbox.

Jeremy
quelle
1
Sehr gute Lösung, aber in meinem Fall funktioniert live () nicht, daher habe ich die on () -Methode verwendet: $ ('input [type = checkbox]'). On ("change", function () {...}) ;;
Massa
4
LIVE ist veraltet. Verwenden Sie es nicht mehr für Antworten im Stapelüberlauf. Amem.
Ismael
Diese Antwort ist wirklich die beste. Sie funktioniert wie erwartet. Auch für Gruppen Checkbox.
Alemoh Rapheal Baja
11

Sie können Javascript im Submit-Ereignis des Formulars ausführen. Das ist alles, was Sie tun können. Es gibt keine Möglichkeit, Browser dazu zu bringen, dies selbst zu tun. Dies bedeutet auch, dass Ihr Formular für Benutzer ohne Javascript unterbrochen wird. Besser ist es, auf dem Server zu wissen, welche Kontrollkästchen vorhanden sind, damit Sie daraus schließen können, dass diejenigen, die in den veröffentlichten Formularwerten ( $_POSTin PHP) nicht vorhanden sind, deaktiviert sind.

Bart van Heukelom
quelle
2
seit php 4.1 können sie auch $ _REQUEST verwenden php.net/manual/en/reserved.variables.request.php
Karl Adler
$_REQUESTDies ist eine gute Vorgehensweise, da es die Wiederverwendung von Code ermöglicht, wenn Ihr Skript beide Methoden unterstützt.
Nichtigkeit
9

Ich würde eigentlich folgendes tun.

Habe mein verstecktes Eingabefeld mit dem gleichen Namen mit dem Kontrollkästchen eingegeben

<input type="hidden" name="checkbox_name[]" value="0" />
<input type="checkbox" name="checkbox_name[]" value="1" />

und wenn ich dann poste, entferne ich zuerst die doppelten Werte, die im $ _POST-Array aufgenommen wurden, und zeige dann jeden der eindeutigen Werte an.

  $posted = array_unique($_POST['checkbox_name']);
  foreach($posted as $value){
    print $value;
  }

Ich habe dies von einem Beitrag erhalten , der doppelte Werte aus dem Array entfernt

desw
quelle
Was ist der Zweck von [] auf dem Namensfeldwert?
Michael Potter
@ MichaelPotter Es ist so, wenn Post an PHP gesendet wird, liest es den Namen `checkbox_name []
Twister1002
@ Twister1002, ich denke, Sie haben den Zweck des Namensattributs beschrieben, nicht den Zweck, [] zum Namen hinzuzufügen. Ich habe eine Websuche durchgeführt und es scheint, dass einige Leute dies mit den Namen tun: Gruppenname [Elementname], um Felder zu gruppieren, aber ich habe keine Erklärung für leer [] gefunden.
Michael Potter
1
@ MichaelPotter Entschuldigung, ich dachte, ich hätte diese Aussage beendet. Aber anscheinend nicht. Lassen Sie mich das wiederholen. Wenn es an PHP gesendet wird, liest der PHP-Prozessor es als Array. Mit jedem Namen wird also checkbox_name[]jeder Wert in ein Array eingegeben, das Sie dann abrufen können. Beispiel: $_POST['checkbox_name'][0]und so weiter mit der Erhöhung, wie viele Felder denselben Namen hatten. Ein anderes Beispiel ist, wenn Sie drei Felder mit dem Namen hatten field_name[], können Sie den zweiten Wert von field_namelike erhalten $_POST['field_name'][1]. Der Zweck kann erstaunlich sein, wenn Sie mehrere Felder mit demselben Namen haben.
Twister1002
8

"Ich habe mich für den Server-Ansatz entschieden. Scheint gut zu funktionieren - danke. - Reach4thelasers 1. Dezember 09 um 15:19" Ich möchte es vom Eigentümer empfehlen. Wie zitiert: Javascript-Lösung hängt davon ab, wie der Server-Handler (ich habe es nicht überprüft)

sowie

if(!isset($_POST["checkbox"]) or empty($_POST["checkbox"])) $_POST["checkbox"]="something";
N Zhang
quelle
8

Ich weiß, dass diese Frage 3 Jahre alt ist, aber ich habe eine Lösung gefunden, die meiner Meinung nach ziemlich gut funktioniert.

Sie können überprüfen, ob die Variable $ _POST zugewiesen ist, und sie in einer Variablen speichern.

$value = isset($_POST['checkboxname'] ? 'YES' : 'NO';

Die Funktion isset () prüft, ob die Variable $ _POST zugewiesen ist. Wenn es nicht zugewiesen ist, ist das Kontrollkästchen logischerweise nicht aktiviert.

Riley Stadel
quelle
Dies ist viel besser, da die beliebteste Antwort eine schreckliche Lösung für Bildschirmleser ist.
Kevin Waterson
7

Die meisten Antworten hier erfordern die Verwendung von JavaScript oder doppelten Eingabesteuerelementen. Manchmal muss dies vollständig serverseitig erledigt werden.

Ich glaube, der (beabsichtigte) Schlüssel zur Lösung dieses häufigen Problems ist die Kontrolle der Übermittlungseingabe des Formulars.

Um nicht aktivierte Werte für Kontrollkästchen erfolgreich zu interpretieren und zu verarbeiten, müssen Sie über folgende Kenntnisse verfügen:

  1. Die Namen der Kontrollkästchen
  2. Der Name des Übermittlungseingabeelements des Formulars

Durch Überprüfen, ob das Formular gesendet wurde (dem Übermittlungseingabeelement wird ein Wert zugewiesen), können alle nicht aktivierten Kontrollkästchenwerte angenommen werden .

Zum Beispiel:

<form name="form" method="post">
  <input name="value1" type="checkbox" value="1">Checkbox One<br/>
  <input name="value2" type="checkbox" value="1" checked="checked">Checkbox Two<br/>
  <input name="value3" type="checkbox" value="1">Checkbox Three<br/>
  <input name="submit" type="submit" value="Submit">
</form>

Bei der Verwendung von PHP ist es ziemlich trivial zu erkennen, welche Kontrollkästchen aktiviert wurden.

<?php

$checkboxNames = array('value1', 'value2', 'value3');

// Persisted (previous) checkbox state may be loaded 
// from storage, such as the user's session or a database.
$checkboxesThatAreChecked = array(); 

// Only process if the form was actually submitted.
// This provides an opportunity to update the user's 
// session data, or to persist the new state of the data.

if (!empty($_POST['submit'])) {
    foreach ($checkboxNames as $checkboxName) {
        if (!empty($_POST[$checkboxName])) {
            $checkboxesThatAreChecked[] = $checkboxName;
        }
    }
    // The new state of the checkboxes can be persisted 
    // in session or database by inspecting the values 
    // in $checkboxesThatAreChecked.
    print_r($checkboxesThatAreChecked);
}

?>

Die anfänglichen Daten konnten bei jedem Laden der Seite geladen werden, sollten jedoch nur geändert werden, wenn das Formular gesendet wurde. Da die Namen der Kontrollkästchen im Voraus bekannt sind, können sie einzeln durchlaufen und überprüft werden, sodass das Fehlen ihrer einzelnen Werte darauf hinweist, dass sie nicht aktiviert sind.

Werner
quelle
6

Ich habe zuerst Sams Version ausprobiert. Gute Idee, aber es gibt mehrere Elemente im Formular mit demselben Namen. Wenn Sie Javascript verwenden, das Elemente basierend auf dem Namen findet, wird jetzt ein Array von Elementen zurückgegeben.

Ich habe Shaileshs Idee in PHP ausgearbeitet, sie funktioniert für mich. Hier ist mein Code:

/ * Löschen Sie die Felder '.hidden', wenn das Original vorhanden ist. Wenn nicht, verwenden Sie den Wert '.hidden'. * /
foreach ($ _POST ['frmmain'] als $ field_name => $ value)
{
    // Sieh dir nur Elemente an, die mit '.hidden' enden.
    if (! substr ($ field_name, -strlen ('. hidden'))) {
        brechen;
    }}

    // erhalte den Namen ohne '.hidden'
    $ real_name = substr ($ key, strlen ($ field_name) - strlen ('. hidden'));

    // Erstelle ein 'falsches' Originalfeld mit dem Wert in '.hidden', wenn kein Original existiert
    if (! array_key_exists ($ real_name, $ POST_copy)) {
        $ _POST [$ real_name] = $ value;
    }}

    // Lösche das '.hidden' Element
    nicht gesetzt ($ _ POST [$ Feldname]);
}}
Wouter
quelle
6

Ich mag auch die Lösung, dass Sie nur ein zusätzliches Eingabefeld posten und JavaScript verwenden, scheint mir ein wenig hackig.

Je nachdem, was Sie für Ihr Backend verwenden, hängt es davon ab, welche Eingabe zuerst erfolgt.

Für ein Server-Backend, in dem das erste Vorkommen (JSP) verwendet wird, sollten Sie Folgendes tun.

  <input type="checkbox" value="1" name="checkbox_1"/>
  <input type="hidden" value="0" name="checkbox_1"/>


Für ein Server-Backend, in dem das letzte Vorkommen verwendet wird (PHP, Rails), sollten Sie Folgendes tun.

  <input type="hidden" value="0" name="checkbox_1"/>
  <input type="checkbox" value="1" name="checkbox_1"/>


Für ein Server-Backend, in dem alle Vorkommen in einem Listendatentyp ( [], array) gespeichert sind . (Python / Zope)

Sie können in beliebiger Reihenfolge posten. Sie müssen lediglich versuchen, den Wert aus der Eingabe mit dem checkboxtype-Attribut abzurufen. Also der erste Index der Liste, wenn sich das Kontrollkästchen vor dem versteckten Element befand, und der letzte Index, wenn sich das Kontrollkästchen nach dem versteckten Element befand.


Bei einem Server-Backend, bei dem alle Vorkommen mit einem Komma (ASP.NET / IIS) verknüpft sind, müssen Sie die Zeichenfolge mithilfe eines Kommas als Trennzeichen (teilen / explodieren), um einen Listendatentyp zu erstellen. ( [])

Jetzt können Sie versuchen, den ersten Index der Liste abzurufen, wenn sich das Kontrollkästchen vor dem ausgeblendeten Element befand, und den letzten Index abzurufen, wenn sich das Kontrollkästchen nach dem ausgeblendeten Element befand.

Behandlung von Backend-Parametern

Bildquelle

TarranJones
quelle
6

Ich verwende diesen Block von jQuery, der bei der Übermittlung zu jedem nicht aktivierten Kontrollkästchen eine versteckte Eingabe hinzufügt. Dies garantiert, dass Sie jedes Mal einen Wert für jedes Kontrollkästchen erhalten, ohne Ihr Markup zu überladen und das Risiko einzugehen, dass Sie es bei einem später hinzugefügten Kontrollkästchen vergessen. Es ist auch unabhängig von dem Backend-Stack (PHP, Ruby usw.), den Sie verwenden.

// Add an event listener on #form's submit action...
$("#form").submit(
    function() {

        // For each unchecked checkbox on the form...
        $(this).find($("input:checkbox:not(:checked)")).each(

            // Create a hidden field with the same name as the checkbox and a value of 0
            // You could just as easily use "off", "false", or whatever you want to get
            // when the checkbox is empty.
            function(index) {
                var input = $('<input />');
                input.attr('type', 'hidden');
                input.attr('name', $(this).attr("name")); // Same name as the checkbox
                input.attr('value', "0"); // or 'off', 'false', 'no', whatever

                // append it to the form the checkbox is in just as it's being submitted
                var form = $(this)[0].form;
                $(form).append(input);

            }   // end function inside each()
        );      // end each() argument list

        return true;    // Don't abort the form submit

    }   // end function inside submit()
);      // end submit() argument list
Matt Holden
quelle
5

Sie können das Ereignis form.submit auch abfangen und vor dem Senden erneut prüfen

$('form').submit(function(event){
    $('input[type=checkbox]').prop('checked', function(index, value){
        return !value;
    });
});
Jimchao
quelle
4

Ich sehe, dass diese Frage alt ist und so viele Antworten hat, aber ich werde trotzdem meinen Cent geben. Ich stimme für die Javascript-Lösung beim "Submit" -Ereignis des Formulars, wie einige betont haben. Keine Verdoppelung der Eingaben (insbesondere wenn Sie lange Namen und Attribute mit PHP-Code gemischt mit HTML haben), keine serverseitigen Probleme (die erfordern würden, alle Feldnamen zu kennen und sie einzeln zu überprüfen), rufen Sie einfach alle ungeprüften Elemente ab Weisen Sie ihnen einen Wert von 0 zu (oder was auch immer Sie benötigen, um den Status "nicht geprüft" anzugeben) und ändern Sie dann ihr Attribut "geprüft" in "wahr"

    $('form').submit(function(e){
    var b = $("input:checkbox:not(:checked)");
    $(b).each(function () {
        $(this).val(0); //Set whatever value you need for 'not checked'
        $(this).attr("checked", true);
    });
    return true;
});

Auf diese Weise erhalten Sie ein $ _POST-Array wie folgt:

Array
(
            [field1] => 1
            [field2] => 0
)
MarcoSpada
quelle
Ich arbeite nicht an meiner Seite. Ich versuche dies zu tun, aber ich poste immer noch nicht alle Kontrollkästchen. [code] $ ("# filter input"). change (Funktion (e) {console.log ('sublmit'); var b = $ ("Eingabe: Kontrollkästchen: nicht (: markiert)"); $ (b) .each (function () {$ (this) .val (2); $ (this) .attr ("geprüft", wahr);}); $ ("# filter"). submit ();}); [/ code]
lio
Hat den Trick für mich gemacht. Der einzige Nachteil - beim Senden eines Formulars wurde jedes Kontrollkästchen aktiviert. Dies kann für einen Benutzer verwirrend sein, aber da die Seite nach dem Absenden des Formulars neu geladen wird, ist dies meines Erachtens ein kleines Problem.
Oksana Romaniv
Wie Oksana sagte, aktiviert es alle Kontrollkästchen, einschließlich aller erforderlichen Kontrollkästchen, die der Benutzer nicht selbst ausgewählt hat, damit das Formular gesendet werden kann, ohne dass der Benutzer einer bestimmten Bedingung zustimmt.
bskool
4
$('form').submit(function () {
    $(this).find('input[type="checkbox"]').each( function () {
        var checkbox = $(this);
        if( checkbox.is(':checked')) {
            checkbox.attr('value','1');
        } else {
            checkbox.after().append(checkbox.clone().attr({type:'hidden', value:0}));
            checkbox.prop('disabled', true);
        }
    })
});
Sajjad Shirazy
quelle
1
Das hat bei mir funktioniert. Anstatt .submit zu verwenden, würden Sie .click verwenden. Entfernen Sie dann das Bit, das die Kontrollkästchen deaktiviert. Danach funktioniert es perfekt.
Cgrouge
1
Beste Antwort, Sie müssen nicht für jeden einen weiteren versteckten Eingang hinzufügen
Sky
3

Was ich getan habe, war ein bisschen anders. Zuerst habe ich die Werte aller nicht aktivierten Kontrollkästchen geändert. Auf "0", dann alle auswählen, damit der Wert übermittelt wird.

function checkboxvalues(){
  $("#checkbox-container input:checkbox").each(function({ 
    if($(this).prop("checked")!=true){
      $(this).val("0");
      $(this).prop("checked", true);
    }
  });
}

Seborreia
quelle
Die Antwort ist gut, aber ich möchte wissen, ob sie sich von der Antwort von @Rameez SOOMRO unterscheidet.
Imran Qamer
Ähnliches Endergebnis, nur so können Sie den Wert der aktivierten Kontrollkästchen nicht ändern.
Seborreia
2

Ich würde es vorziehen, die $ _POST zusammenzustellen

if (!$_POST['checkboxname']) !$_POST['checkboxname'] = 0;

Es macht etwas aus, wenn der POST nicht den Wert 'Checkboxname' hat, wurde er deaktiviert, also weisen Sie einen Wert zu.

Sie können ein Array Ihrer ckeckbox-Werte erstellen und eine Funktion erstellen, die prüft, ob Werte vorhanden sind. Wenn dies nicht der Fall ist, werden sie deaktiviert, und Sie können einen Wert zuweisen

Felipe Gonzalez
quelle
1

Beispiel für Ajax-Aktionen ist (': check') jQuery anstelle von .val ();

            var params = {
                books: $('input#users').is(':checked'),
                news : $('input#news').is(':checked'),
                magazine : $('input#magazine').is(':checked')
            };

Parameter erhalten den Wert in TRUE OR FALSE.

Mehmet Ali Uysal
quelle
1

Kontrollkästchen stellen normalerweise Binärdaten dar, die in der Datenbank als Ja / Nein-, J / N- oder 1/0-Werte gespeichert sind. HTML-Kontrollkästchen haben einen schlechten Charakter, um nur dann einen Wert an den Server zu senden, wenn das Kontrollkästchen aktiviert ist! Das bedeutet, dass das Serverskript auf einer anderen Site im Voraus wissen muss, welche Kontrollkästchen auf der Webseite möglich sind, um positive (aktivierte) oder negative (nicht aktivierte) Werte speichern zu können. Tatsächlich sind nur negative Werte problematisch (wenn der Benutzer den zuvor (vor) geprüften Wert deaktiviert - wie kann der Server dies wissen, wenn nichts gesendet wird, wenn er nicht im Voraus weiß, dass dieser Name gesendet werden soll). Wenn Sie ein serverseitiges Skript haben, das dynamisch ein UPDATE-Skript erstellt, liegt ein Problem vor, da Sie nicht wissen, welche Kontrollkästchen empfangen werden sollen, um den Y-Wert für aktivierte und den N-Wert für nicht aktivierte (nicht empfangene) festzulegen.

Da ich die Werte 'Y' und 'N' in meiner Datenbank speichere und sie über aktivierte und deaktivierte Kontrollkästchen auf der Seite darstelle, habe ich für jeden Wert (Kontrollkästchen) ein ausgeblendetes Feld mit 'Y'- und' N'-Werten hinzugefügt und dann Kontrollkästchen nur zur visuellen Darstellung verwendet Darstellung und verwenden Sie die einfache JavaScript-Funktion check (), um den Wert von if entsprechend der Auswahl festzulegen.

<input type="hidden" id="N1" name="N1" value="Y" />
<input type="checkbox"<?php if($N1==='Y') echo ' checked="checked"'; ?> onclick="check(this);" />
<label for="N1">Checkbox #1</label>

Verwenden Sie einen JavaScript-Onclick-Listener und rufen Sie die Funktion check () für jedes Kontrollkästchen auf meiner Webseite auf:

function check(me)
{
  if(me.checked)
  {
    me.previousSibling.previousSibling.value='Y';
  }
  else
  {
    me.previousSibling.previousSibling.value='N';
  }
}

Auf diese Weise werden "Y" - oder "N" -Werte immer an das serverseitige Skript gesendet. Es weiß, welche Felder aktualisiert werden sollten, und es ist nicht erforderlich, den Wert "checbox" on "in" Y "umzuwandeln oder das Kontrollkästchen nicht empfangen in" N "zu konvertieren '.

HINWEIS: Leerzeichen oder neue Zeilen sind ebenfalls Geschwister, daher benötige ich hier .previousSibling.previousSibling.value. Wenn kein Leerzeichen dazwischen ist, dann nur .previousSibling.value


Sie müssen den Onclick-Listener nicht wie zuvor explizit hinzufügen. Mit der jQuery-Bibliothek können Sie den Click-Listener mit der Funktion dynamisch hinzufügen, um den Wert aller Kontrollkästchen auf Ihrer Seite zu ändern:

$('input[type=checkbox]').click(function()
{
  if(this.checked)
  {
    $(this).prev().val('Y');
  }
  else
  {
    $(this).prev().val('N');
  }
});
sbrbot
quelle
1

Alle Antworten sind großartig, aber wenn Sie mehrere Kontrollkästchen in einem Formular mit demselben Namen haben und den Status jedes Kontrollkästchens veröffentlichen möchten. Dann habe ich dieses Problem gelöst, indem ich ein verstecktes Feld mit dem Kontrollkästchen platziert habe (Name bezogen auf das, was ich will).

<input type="hidden" class="checkbox_handler" name="is_admin[]" value="0" />
<input type="checkbox" name="is_admin_ck[]" value="1" />

Steuern Sie dann den Änderungsstatus des Kontrollkästchens mithilfe des folgenden Abfragecodes:

$(documen).on("change", "input[type='checkbox']", function() {
    var checkbox_val = ( this.checked ) ? 1 : 0;
    $(this).siblings('input.checkbox_handler').val(checkbox_val);
});

Wenn Sie jetzt ein Kontrollkästchen ändern, wird der Wert des zugehörigen ausgeblendeten Felds geändert. Auf dem Server können Sie nur nach ausgeblendeten Feldern anstatt nach Kontrollkästchen suchen.

Hoffe, dies wird jemandem helfen, diese Art von Problem zu haben. jubeln :)

Imran Khan
quelle
1

Das Problem mit Kontrollkästchen besteht darin, dass sie nicht mit Ihrem Formular gebucht werden, wenn sie nicht aktiviert sind. Wenn Sie ein Kontrollkästchen aktivieren und ein Formular veröffentlichen, erhalten Sie den Wert des Kontrollkästchens in der Variablen $ _POST, mit dem Sie ein Formular verarbeiten können. Wenn das Kontrollkästchen deaktiviert ist, wird der Variablen $ _POST kein Wert hinzugefügt.

In PHP umgehen Sie dieses Problem normalerweise, indem Sie ein isset () - Check für Ihr Checkbox-Element durchführen. Wenn das erwartete Element nicht in der Variablen $ _POST festgelegt ist, wissen wir, dass das Kontrollkästchen nicht aktiviert ist und der Wert falsch sein kann.

if(!isset($_POST['checkbox1']))
{
     $checkboxValue = false;
} else {
     $checkboxValue = $_POST['checkbox1'];
}

Wenn Sie jedoch ein dynamisches Formular erstellt haben, kennen Sie das Namensattribut Ihrer Kontrollkästchen nicht immer. Wenn Sie den Namen des Kontrollkästchens nicht kennen, können Sie mit der Funktion isset nicht überprüfen, ob dieses Formular gesendet wurde die Variable $ _POST.

Daniel Galecki
quelle
1
function SubmitCheckBox(obj) {
     obj.value   = obj.checked ? "on" : "off";
     obj.checked = true;
     return obj.form.submit();
}

<input type=checkbox name="foo" onChange="return SubmitCheckBox(this);">
ledav.net
quelle
0

Es gibt eine bessere Problemumgehung. Geben Sie zunächst nur den Kontrollkästchen, die aktiviert sind, ein Namensattribut. Klicken Sie dann beim Klicken submitüber ein JavaScript functionauf alle nicht aktivierten Kontrollkästchen. Wenn Sie also submitnur diejenigen abrufen form collection, die sie habenname Eigentum haben.

  //removing name attribute from all checked checkboxes
                  var a = $('input:checkbox:checked');
                   $(a).each(function () {
                       $(this).removeAttr("name");        
                   });

   // checking all unchecked checkboxes
                   var b = $("input:checkbox:not(:checked)");
                   $(b).each(function () {
                       $(this).attr("checked", true);
                   });

Vorteil: Sie müssen keine zusätzlichen versteckten Boxen erstellen und bearbeiten.

Gyanesh Gouraw
quelle
0

@cpburnz hat es richtig gemacht, aber zu viel Code, hier ist die gleiche Idee mit weniger Code:

JS:

// jQuery OnLoad
$(function(){
    // Listen to input type checkbox on change event
    $("input[type=checkbox]").change(function(){
        $(this).parent().find('input[type=hidden]').val((this.checked)?1:0);
    });
});

HTML (notieren Sie den Feldnamen mit einem Array-Namen):

<div>
    <input type="checkbox" checked="checked">
    <input type="hidden" name="field_name[34]" value="1"/>
</div>
<div>
    <input type="checkbox">
    <input type="hidden" name="field_name[35]" value="0"/>
</div>
<div>

Und für PHP:

<div>
    <input type="checkbox"<?=($boolean)?' checked="checked"':''?>>
    <input type="hidden" name="field_name[<?=$item_id?>]" value="<?=($boolean)?1:0?>"/>
</div>
Rodrigo Polo
quelle
0

jQuery-Version von @ vishnus Antwort.

if($('#testName').is(":checked")){
    $('#testNameHidden').prop('disabled', true);
}

Wenn Sie jQuery 1.5 oder niedriger verwenden, verwenden Sie bitte die Funktion .attr () anstelle von .prop ().

0x1ad2
quelle
0

Diese Lösung ist von der von @ desw inspiriert.

Wenn Ihre Eingabenamen im "Formularstil" vorliegen, verlieren Sie die Array-Indexzuordnung zu Ihren Chekbox-Werten, sobald eine Chekbox aktiviert ist, und erhöhen diese "Dissoziation" bei jeder Überprüfung einer Chekbox um eine Einheit. Dies kann der Fall sein bei einem Formular zum Einfügen von Mitarbeitern, die aus bestimmten Feldern bestehen, z. B.:

<input type="text" name="employee[]" />
<input type="hidden" name="isSingle[] value="no" />
<input type="checkbox" name="isSingle[] value="yes" />

Wenn Sie drei Mitarbeiter gleichzeitig einfügen und der erste und der zweite Mitarbeiter einzeln sind, erhalten Sie ein 5-Element isSingle Array , sodass Sie beispielsweise nicht sofort durch die drei Arrays iterieren können, um dies zu tun , Mitarbeiter in eine Datenbank einfügen.

Sie können dies mit einer einfachen Array-Nachbearbeitung überwinden. Ich verwende PHP auf der Serverseite und habe Folgendes getan:

$j = 0;
$areSingles = $_POST['isSingle'];
foreach($areSingles as $isSingle){
  if($isSingle=='yes'){
    unset($areSingles[$j-1]);
  }
  $j++;
}
$areSingles = array_values($areSingles);
Pere
quelle
0

Diese Lösung ist für diese Frage übertrieben, aber sie hat mir geholfen, als ich das gleiche Kontrollkästchen hatte, das für verschiedene Zeilen in einer Tabelle häufig vorkam. Ich musste die Zeile kennen, die das Kontrollkästchen darstellt, und auch den Status des Kontrollkästchens kennen (aktiviert / deaktiviert).

Ich habe das Namensattribut aus meinen Checkbox-Eingaben entfernt, allen dieselbe Klasse zugewiesen und eine versteckte Eingabe erstellt, die das JSON-Äquivalent der Daten enthält.

HTML

 <table id="permissions-table">
    <tr>
	<td>
	    <input type="checkbox" class="has-permission-cb" value="Jim">
	    <input type="checkbox" class="has-permission-cb" value="Bob">
	    <input type="checkbox" class="has-permission-cb" value="Suzy">
	</td>
    </tr>
 </table>
 <input type="hidden" id="has-permissions-values" name="has-permissions-values" value="">

Javascript zum Ausführen auf Formular senden

var perms = {};
$(".has-permission-checkbox").each(function(){
  var userName = this.value;
  var val = ($(this).prop("checked")) ? 1 : 0
  perms[userName] = {"hasPermission" : val};
});
$("#has-permissions-values").val(JSON.stringify(perms));

Die JSON-Zeichenfolge wird mit dem Formular $ _POST ["has-permissions-values"] übergeben. Dekodieren Sie in PHP die Zeichenfolge in ein Array, und Sie erhalten ein assoziatives Array mit jeder Zeile und dem True / False-Wert für jedes entsprechende Kontrollkästchen. Es ist dann sehr einfach, durch die aktuellen Datenbankwerte zu gehen und diese zu vergleichen.

Tmac
quelle