2016-08-08 16 views
0

Ich arbeite an einem Projekt, das die Daten über Databases jquery Plugin anzeigt. In der ersten Spalte der Datentabelle habe ich ein Kontrollkästchen speziell für ein Bootstrap SquaredFour-Kontrollkästchen gesetzt. Also, die erste Spalte in allen Zeilen, hat das Kontrollkästchen. Die nächste Aufgabe besteht darin, alle Zeilen löschen zu können, die überprüft werden. Ich habe oben eine Schaltfläche zum Löschen, die aktiviert wird, wenn mindestens eine überprüfte Zeile vorhanden ist. Sobald der Benutzer auf die Schaltfläche Löschen klickt, sollte er in der Lage sein, die Zeile zu löschen.Datatables squaredFour Kontrollkästchen multidelete Funktion

Ich verstehe nicht, aus irgendeinem Grund kann ich nicht mehr als eine Zeile auswählen. Sobald ich ein Kontrollkästchen ankreuze, ist es ausgewählt und wenn ich versuche, ein anderes Kontrollkästchen zu aktivieren, wird das ausgewählte Kontrollkästchen deaktiviert. All dies geschieht nur für die erste Checkbox. Ist das wegen Bootstrap?

Dies ist der Code für das Kontrollkästchen. Ich kehrte sie als Tabellendaten,

$('#example').DataTable({ 
    "processing": true, 
     "serverSide": true, 
      "sPaginationType": "full_numbers", 
      // "ajax": "http://localhost:9080/dataTable/tests/user.php" 
       "ajax" : { 
        "url" : "http://localhost:9080/swetha/swetha_gmail_to_bbe/trunk/public/" + "swethasemail/mail-ajax/get-data-table/format/json/", 
        "dataType": "json" 
       }, 
       "columnDefs": [{ 
         "targets": 0, 
         "orderable": false, 
         "className": "dt-body-center", 
         "render": function(data, type, full, meta){ 
          return '<div class="squaredFour "><input type="checkbox" value="None" id="squaredFour" name="check" /><label for="squaredFour"></label></div>'; 
         }, 

       }], 

In dem obigen Code es eine Checkbox zurückgibt, die in der TD-Feld in der Datentabelle aufgefüllt wird. The checkboxes on the user interface

Bitte schlagen Sie mir eine Lösung dafür vor. Oder wenn es eine andere Möglichkeit gibt, eine Checkbox-Funktion auf Datatable für Multidelete zu implementieren, lassen Sie es mich bitte wissen.

+0

Was passiert, wenn Sie ein Kontrollkästchen aktivieren (oder steuern)? Wählt es mehrere oder wählt es immer nur eines aus? –

+0

@Chris. Ich habe versucht, Strg-Klick. Wenn ich zum ersten Mal ctrl klicke, wird das erste Feld in der Spalte ausgewählt. Wenn ich ein zweites Mal auf ein anderes Kontrollkästchen klicke, ist die erste Box deaktiviert. Das angeklickte Kontrollkästchen ändert sich nicht. Wenn ich es erneut überprüfe, wird das erste Kontrollkästchen aktiviert. Alles passiert nur für das erste Kontrollkästchen. –

+0

Hm, das ist seltsam. Sind Sie vollständig an die Kontrollkästchen gebunden, die Sie gerade haben? Wenn Sie etwas anderes ausprobieren möchten, gibt es eine Datatables-Erweiterung (vom Autor von DataTables geschrieben) namens Select, die das Auswählen von Zeilen für die Manipulation (z. B. Löschen in Ihrem Fall) erleichtert. Es hat auch eine Checkbox-Funktion. Prüfe es [hier] (https://datatables.net/extensions/select/). –

Antwort

0

Wie in den Kommentaren vorgeschlagen, können Sie in der Verlängerung Datentabellen aussehen: https://datatables.net/extensions/select/examples/initialisation/multi.html

Alternativ, hier ist, wie ich es:

"columns": [ 
    { 
     data: "approved", 
     render: function (data, type, full, meta) { 
      return '<input type="checkbox" id="' + full.id + '"/>&nbsp;'; 
     } 
    }, 
], 

Beachten Sie, dass jeder Eingang eine eindeutige ID hat.

+0

Danke. Das hat funktioniert. Die Hauptidee des Projekts besteht darin, ein E-Mail-System wie Google Mail zu erstellen. Sobald der Benutzer auf eine Zeile klickt, wird der Text wie in Google Mail geöffnet. Die Auswahl einer Zeile sollte nur über das Kontrollkästchen erfolgen. Sobald der Benutzer das Kontrollkästchen anklickt, wird die ausgewählte Zeile ausgewählt. Wenn er auf die Zeile klickt, sollte er den Körper öffnen. Ist es möglich, diese Auswahloption so anzupassen, dass sie nur mit Kontrollkästchen funktioniert? –

+0

Nicht zu meinem Wissen. Mit der Auswahloption können Sie eine beliebige Stelle in der Zeile auswählen. Wenn Sie nur möchten, dass die Benutzer mit Kontrollkästchen auswählen, finden Sie in meiner Lösung oben. –

+0

Do, ich brauche, dass Attributspalten in dem –