Bagaimana untuk Mengesahkan Kotak Teks Ditambah Secara Dinamik dalam Jadual Menggunakan JavaScript dan jQuery?

Cara Menambah Pengesahan pada Kotak Teks Dinamik dalam Jadual

Memahami Cabaran

Anda mempunyai jadual dengan baris yang dijana secara dinamik yang mengandungi kotak teks. Matlamatnya ialah untuk menambah kelas CSS (cth., input-validation-error) pada semua kotak teks dalam jadual untuk pengesahan pihak klien apabila pengguna mengklik butang "Simpan".

Melaksanakan Pengesahan Bahagian Pelanggan untuk Kotak Teks Dinamik

1. Pastikan Struktur HTML yang Betul:

Untuk mendayakan pengesahan pihak klien, anda mesti memasukkan atribut data-val khusus untuk medan yang diperlukan dan ruang letak mesej untuk mesej pengesahan. Selain itu, input tersembunyi adalah penting untuk mengekalkan pengindeks apabila menambah atau mengalih keluar baris.

2. Menyediakan Fungsi JavaScript:

function AddTargetItem(TargetColor_U, D90Target_U, D10Target_U, TargetColor_V, D90Target_V, D10Target_V, Thickness, FilmWidth, TargetDate)  {
  var rowCount = $('#tbTargetDetails tr').length;
  var rowCountBil = rowCount + 1;

  var row = '<tr>

3. Kendalikan Baris Ditambah Secara Dinamik:

Apabila baris baharu ditambahkan, perpustakaan tidak mengganggu Pengesahan jQuery perlu ditinjau semula.

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

4. Mengalih Keluar Baris:

Anda boleh mengendalikan mengalih keluar baris secara pilihan dengan memasukkan pengendali acara atau menggunakan butang khusus dalam setiap baris. Kemas kini fungsi AddTargetItem untuk mempertimbangkan senario seperti memadamkan baris atau menilai semula indeks.

Petua Tambahan:

• Pertimbangkan untuk menggunakan CSS untuk penggayaan dan bukannya gaya sebaris.
• Teroka alternatif pendekatan seperti menggunakan pandangan separa untuk menjana baris, menawarkan lebih kebolehselenggaraan apabila menambah/menukar atribut pengesahan.
• Ingat untuk menyemak Model, Paparan dan fungsi JavaScript anda untuk mencari ralat dan pastikan ia sejajar dengan logik yang anda inginkan.

Atas ialah kandungan terperinci Bagaimana untuk Mengesahkan Kotak Teks Ditambah Secara Dinamik dalam Jadual Menggunakan JavaScript dan jQuery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!