jQuery: Überprüfen Sie, ob eine Tabellenzeile mit bestimmten Werten bereits existiert

Question

Ich habe ein jQuery-Skript, das eine Zeile an eine Tabelle anfügt. Kurz gesagt, der Benutzer kann einen Wert aus einem Dropdown-Menü auswählen, dann 'x' Monat eingeben und 'add' drücken, wodurch die Zeile an die Tabelle angehängt wird. Zum Beispiel wird die folgende Zeile vom Benutzer angehängt:

<tr> 
    <td>Some Value</td> 
    <td>2</td> 
</tr> 

Nun, wenn der Benutzer wieder die gleiche Operation durchführt, muss ich den Vorgang stoppen und warnen ihn, dass er einen doppelten Mehrwert zu schaffen versucht. Wie kann ich mithilfe von jQuery prüfen, ob die obige Zeile bereits existiert oder nicht, wobei das erste und zweite Element <td> denselben Wert haben wie die Daten, die er hinzufügen möchte? Der Grund, warum ich die ersten und zweiten <td> Elemente nur sage, ist, weil es andere <td> Elemente in der Reihe gibt, aber sie enthalten versteckte Felder, die die neu hinzugefügten Daten an ein serverseitiges Skript übergeben, also möchte ich die Validierung so kurz und halten so einfach wie möglich.

Wenn es keine Hilfe ist, ist die Tabelle ID #tblspecializations

Vielen Dank für Ihre Eingabe.

Answer 1

Sie könnten in der Lage sein zu verwenden :contains():

$('#tblspecializations tr > td:contains(Some Value) + td:contains(2)').length 

- Example

bewusst sein, aber, dass : contains() wird das Element zurück, wenn der String in der überall abgestimmt ist Text des Elements.

Answer 2

Ich würde vorschlagen, dass Sie Ihre Daten in einer Datenstruktur halten (ein (assoziatives) Array zum Beispiel). Daher werden Sie die Daten in der Struktur und nicht im DOM überprüfen.

Answer 3

Um es kurz zu machen, sollte der folgende Code in der click() Handler Ihnen in Ihrer Situation helfen; Sie können see the whole code in action:

$(function(){ 
    $("#btn").click(function(){ 
     var table = $("#tblspecializations"); 
     var firstTd = $("td:first", table); 
     var secondTd = firstTd.next(); 

     if(firstTd.text() == $("#dropdown").val() && secondTd.text() == $("#num").val()) 
      alert("Error: You're trying to add the same entry"); 
    }); 
}); 

Kurze Erklärung: Durch td:first im Selektor, sind Sie die erste Spalte in der Tabelle bekommen, und durch die next()-Funktion, Sie seine Geschwister bekommen, nämlich die zweite Spalte.