suchen
HeimWeb-FrontendCSS-TutorialWie wende ich die Klassenvalidierung auf dynamische Textfelder in einer Tabelle mithilfe der unaufdringlichen jQuery-Validierung an?

How to Apply Class Validation to Dynamic Textboxes in a Table Using jQuery Unobtrusive Validation?

Klassenvalidierung für dynamische Textfelder in einer Tabelle festlegen

Das Problem verstehen

Sie haben eine dynamische Tabelle mit Textfeldern und möchten eine Klasse anwenden Validierung für alle diese Textfelder. Die unauffällige Validierung von jQuery registriert die hinzugefügten Textfelder nicht, was dazu führt, dass die Validierung nicht funktioniert.

Behebung des Problems

Um dieses Problem zu beheben, müssen Sie Folgendes tun:

  • Datenattribute hinzufügen: Fügen Sie die erforderlichen Datenvalattribute hinzu Textfelder.
  • Platzhalterelemente generieren: Platzhalterelemente für die Anzeige von Validierungsmeldungen erstellen.
  • Nicht aufeinanderfolgende Indexer zulassen: Fügen Sie eine versteckte Eingabe für die hinzu Indexer, um nicht aufeinanderfolgende Indexer für die geposteten Daten zu aktivieren Sammlung.

Aktualisiertes HTML mit versteckter Indexer-Eingabe

@for (int i = 0; i 
        <td>
            @Html.TextBoxFor(m => m.TargetInfo[i].TargetColor_U, new { id = "", @class = "form-control" })
            @Html.ValidationMessageFor(m => m.TargetInfo[i].TargetColor_U)
            <input type="hidden" name="TargetInfo.Index" value="@i">
        </td>
        <!-- Other columns with similar markup -->
    
}

Aktualisiertes JavaScript mit nicht-konsekutiven Indexern

var form = $('form');
var newrow = $('#newrow');
var tablebody = $('#tablebody');

$("#btnAddTarget").click(function() {
    var index = (new Date()).getTime();
    var clone = newrow.clone();
    clone.html($(clone).html().replace(/#/g, index));
    var row = clone.find('tr');
    tablebody.append(row);

    // Reparse the validator using unobtrusive validation
    form.data('validator', null);
    $.validator.unobtrusive.parse(form);
});

Zusätzliche Tipps

  • Nach dem Hinzufügen von Dynamik ist eine unauffällige Neuanalyse der Validierung erforderlich Inhalt.
  • Versteckte Indexer ermöglichen das Löschen nicht aufeinanderfolgender Zeilen.
  • Verwenden Sie CSS für die Gestaltung anstelle von Inline-Stilen.
  • Erwägen Sie die Verwendung von Teilansichten zur Wartbarkeit.

Das obige ist der detaillierte Inhalt vonWie wende ich die Klassenvalidierung auf dynamische Textfelder in einer Tabelle mithilfe der unaufdringlichen jQuery-Validierung an?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Zwei Bilder und eine API: alles, was wir für die Wiederbelebung von Produkten brauchenZwei Bilder und eine API: alles, was wir für die Wiederbelebung von Produkten brauchenApr 15, 2025 am 11:27 AM

Ich habe kürzlich eine Lösung gefunden, um die Farbe eines Produktbildes dynamisch zu aktualisieren. Mit nur einem Produkt können wir es auf unterschiedliche Weise zeigen, um zu zeigen

Wöchentliche Plattformnachrichten: Auswirkungen von Code von Drittanbietern, passive gemischte Inhalte, Länder mit den langsamsten VerbindungenWöchentliche Plattformnachrichten: Auswirkungen von Code von Drittanbietern, passive gemischte Inhalte, Länder mit den langsamsten VerbindungenApr 15, 2025 am 11:19 AM

In der Roundup in dieser Woche wird Lighthouse beleuchtet, die Drittanbieter-Skripte, unsichere Ressourcen auf sicheren Websites und viele Länderverbindungsgeschwindigkeiten blockiert werden

Optionen zum Hosting Ihrer eigenen nicht-javaScript-basierten AnalysenOptionen zum Hosting Ihrer eigenen nicht-javaScript-basierten AnalysenApr 15, 2025 am 11:09 AM

Es gibt eine Menge Analyseplattformen, mit denen Sie Besucher- und Nutzungsdaten auf Ihren Websites verfolgen können. Vielleicht vor allem Google Analytics, das weit verbreitet ist

Es ist alles in der KopfEs ist alles in der KopfApr 15, 2025 am 11:01 AM

Der Dokumentkopf ist vielleicht nicht der glamouröseste Teil einer Website, aber was darauf einfließt

Was ist Super () in JavaScript?Was ist Super () in JavaScript?Apr 15, 2025 am 10:59 AM

Was passiert, wenn Sie ein JavaScript sehen, das Super () aufruft. In einer Kinderklasse verwenden Sie Super (), um den Konstruktor und Super des Elternteils anzurufen. zugreifen

Vergleich der verschiedenen Arten von nativen JavaScript -PopupsVergleich der verschiedenen Arten von nativen JavaScript -PopupsApr 15, 2025 am 10:48 AM

JavaScript verfügt über eine Vielzahl von integrierten Popup-APIs, die eine spezielle Benutzeroberfläche für die Benutzerinteraktion anzeigen. Berühmt:

Warum sind zugängliche Websites so schwer zu erstellen?Warum sind zugängliche Websites so schwer zu erstellen?Apr 15, 2025 am 10:45 AM

Ich habe neulich mit einigen Front-End-Leuten darüber gesprochen, warum so viele Unternehmen zugängliche Websites erstellen. Warum sind Websites so schwer zugänglich?

Das `versteckte Attribut ist sichtlich schwachDas `versteckte Attribut ist sichtlich schwachApr 15, 2025 am 10:43 AM

Es gibt ein HTML -Attribut, das genau das tut, was Sie denken, dass es tun sollte:

See all articles

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

AI Hentai Generator

AI Hentai Generator

Erstellen Sie kostenlos Ai Hentai.

Heißer Artikel

R.E.P.O. Energiekristalle erklärten und was sie tun (gelber Kristall)
4 Wochen vorBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Beste grafische Einstellungen
4 Wochen vorBy尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. So reparieren Sie Audio, wenn Sie niemanden hören können
4 Wochen vorBy尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: Wie man alles in Myrise freischaltet
1 Monate vorBy尊渡假赌尊渡假赌尊渡假赌

Heiße Werkzeuge

SAP NetWeaver Server-Adapter für Eclipse

SAP NetWeaver Server-Adapter für Eclipse

Integrieren Sie Eclipse mit dem SAP NetWeaver-Anwendungsserver.

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Herunterladen der Mac-Version des Atom-Editors

Herunterladen der Mac-Version des Atom-Editors

Der beliebteste Open-Source-Editor

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

EditPlus chinesische Crack-Version

EditPlus chinesische Crack-Version

Geringe Größe, Syntaxhervorhebung, unterstützt keine Code-Eingabeaufforderungsfunktion