it-swarm.com.de

So übergeben Sie mehrere Kontrollkästchen mit jQuery ajax post

So übergeben Sie mehrere Kontrollkästchen mit jQuery ajax post

dies ist die Ajax-Funktion

 function submit_form(){
 $.post("ajax.php", {
 selectedcheckboxes:user_ids,
 confirm:"true"
 },
 function(data){
  $("#lightbox").html(data);
  });
 }

und das ist meine Form

<form>
<input type='checkbox' name='user_ids[]' value='1'id='checkbox_1' />
<input type='checkbox' name='user_ids[]' value='2'id='checkbox_2' />
<input type='checkbox' name='user_ids[]' value='3'id='checkbox_3' />
<input name="confirm" type="button" value="confirm" onclick="submit_form();" />
</form>
26
ahmed

Aus den Jquery-Dokumenten für POST ( drittes Beispiel ):

$.post("test.php", { 'choices[]': ["Jon", "Susan"] });

Also würde ich einfach über die markierten Kästchen iterieren und das Array erstellen. So etwas wie

var data = { 'user_ids[]' : []};
$(":checked").each(function() {
  data['user_ids[]'].Push($(this).val());
});
$.post("ajax.php", data);
46
Paul Tarjan

Ich habe gerade versucht, eine Lösung für dasselbe Problem zu finden. Implementierung der Lösung von Paul Ich habe ein paar Verbesserungen vorgenommen, damit diese Funktion ordnungsgemäß funktioniert.

var data = { 'venue[]' : []};

$("input:checked").each(function() {
   data['venue[]'].Push($(this).val());
});

Kurz gesagt, das Hinzufügen von input: checked im Gegensatz zu: checked begrenzt die in das Array eingegebenen Felder nur auf die Kontrollkästchen im Formular. Paulus ist in der Tat richtig, da this als $(this) eingeschlossen werden muss. 

14
simnom

Könnte Folgendes verwenden und dann das Post-Ergebnis explode(",", $_POST['data']); auflösen, um eine Reihe von Ergebnissen zu erhalten.

var data = new Array();
$("input[name='checkBoxesName']:checked").each(function(i) {
    data.Push($(this).val());
});
10
Phil Jackson

Hier ist ein flexiblerer Weg.

sagen wir, das ist deine Form.

<form>
<input type='checkbox' name='user_ids[]' value='1'id='checkbox_1' />
<input type='checkbox' name='user_ids[]' value='2'id='checkbox_2' />
<input type='checkbox' name='user_ids[]' value='3'id='checkbox_3' />
<input name="confirm" type="button" value="confirm" onclick="submit_form();" />
</form>

Und das ist dein Jquery Ajax unten ...

                // Don't get confused at this portion right here
                // cuz "var data" will get all the values that the form
                // has submitted in the $_POST. It doesn't matter if you 
                // try to pass a text or password or select form element.
                // Remember that the "form" is not a name attribute
                // of the form, but the "form element" itself that submitted
                // the current post method
                var data = $("form").serialize(); 

                $.ajax({
                    url: "link/of/your/ajax.php", // link of your "whatever" php
                    type: "POST",
                    async: true,
                    cache: false,
                    data: data, // all data will be passed here
                    success: function(data){ 
                        alert(data) // The data that is echoed from the ajax.php
                    }
                });

Und in Ihrer ajax.php versuchen Sie, Ihren Beitrag zu wiederholen oder auszudrucken, um zu sehen, was darin passiert. Das sollte so aussehen. Nur von Ihnen markierte Kontrollkästchen werden zurückgegeben. Wenn Sie keine ausgewählt haben, wird ein Fehler ausgegeben.

<?php 
    print_r($_POST); // this will be echoed back to you upon success.
    echo "This one too, will be echoed back to you";

Hoffe das ist klar genug.

Wenn Sie keine eigene Lösung entwickeln möchten, sehen Sie sich dieses jQuery-Plugin an:

malsup.com/jquery/form/

Es wird das und mehr für Sie tun. Es ist sehr zu empfehlen.

2
Gabriel Hurley

Das Folgende von Paul Tarjan arbeitete für mich,

var data = { 'user_ids[]' : []};
$(":checked").each(function() {
  data['user_ids[]'].Push($(this).val());
});
$.post("ajax.php", data);

aber ich hatte mehrere Formulare auf meiner Seite und es wurden markierte Kästchen aus allen Formularen gezogen, also habe ich die folgende Änderung vorgenommen, sodass es nur aus einem Formular gezogen wurde

var data = { 'user_ids[]' : []};
$('#name_of_your_form input[name="user_ids[]"]:checked').each(function() {
  data['user_ids[]'].Push($(this).val());
});
$.post("ajax.php", data);

Ändern Sie einfach name_of_your_form in den Namen Ihres Formulars.

Ich erwähne auch, dass, wenn ein Benutzer keine Kästchen aktiviert, kein Array in PHP ausgegeben wird. Ich musste wissen, ob ein Benutzer alle Kontrollkästchen deaktiviert hat. Daher fügte ich dem Formular Folgendes hinzu:

<input style="display:none;" type="checkbox" name="user_ids[]" value="none" checked="checked"></input>

Auf diese Weise wird das Array mit dem Wert "none" gesetzt, wenn keine Kontrollkästchen aktiviert sind.

1
Mike

Das wäre besser und einfacher

var arr = $('input[name="user_ids[]"]').map(function(){
  return $(this).val();
}).get();

console.log(arr);
0
SagarPPanchal