Witam.
Mam pewien problem.
Posiadam formularz, gdzie po kliknięciu przycisku "dodaj" zostaje dodany kolejny rząd pól tekstowych z inną wartością "name".
Jednak jak zrobić aby dane z tych pól były pobierane, gdyż skrypt ma wykonywać działania na tych polach.
Pola są oczywiście tworzone za pomocą JS.
Pozdrawiam.
Jaki język masz w backendzie?
<html>
<head>
<style type="text/css" rel="stylesheet" href="css.css">
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#dodajWiersz').click(function() {
//policz ile jest wierszy w tabeli
var liczba = $('#tabela tr').length;
//pierwsza komórka
var f1 = '<td><input type="text" class="medium" name="urzadzenie[]"/></td>';
//druga komórka
var f2 = '<td><input type="text" class="medium" name="ilosc[]"/></td>';
//trzecia komórka
var f3 = '<td><a class="button delete" href="#">Usuń wiersz</a></td>';
//w tej zmiennej definiujemy nowy wiersz w tabeli
var row = '<tr class="none" id="wiersz-'+liczba+'"><td>'+liczba+'</td>'+f1+f2+f3+'</tr>';
//dołącz nowy wiersz na końcu tabeli
$('#tabela').find('tbody').append(row);
//usuwamy klasę: none z wiersza oraz animujemy efekt dodawania wiersza
$('tr.none').removeClass('none').animate({'backgroundColor':'#66B04D','color':'#fff'},300,function(){
$(this).animate({'backgroundColor':'#fff','color':'#000'},300);
});
});
//funkcja odczytująca kliknięcie w element o klasie: delete
$('.delete').live('click',function() {
//znajdź najbliższy wiersz będący elementem nadrzędnym dla linka usuwającego ten wiersz
//i wykonaj animację
$(this).closest('tr').animate({'backgroundColor':'#EF3E23','color':'#fff'},300,function(){
//usuń dany wiersz
$(this).remove();
//aktualizuj numery pozostałych wierszy
$('#tabela > tbody > tr').each(function(i) {
//wpisz nowy numer wewnątrz pierwszej komórki danego wiersza
$(this).find('td:first-child').text(i+1);
});
});
});
});
</script>
</head>
<body>
<p><a href="#" id="dodajWiersz" class="add button">Dodaj nowy wiersz</a></p>
<table id="tabela">
<thead>
<tr>
<th>Lp.</th>
<th>Urządzenie</th>
<th>Ilość</th>
<th></th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</body>
</html>
Na ten moment mam taki kod, jednak wszystkie nazwy pól są te same.
Na razie podałem tylko tyle pól, ma to być kalkulator obliczający zużycie energii w domu, wolałbym żeby wartość była wyświetlana na stronie bez jej przeładowywania.
Przepraszam że odświeżam temat ale zależy mi na czasie.
No to pokombinuj z iterowaniem po każdym z tych dynamicznie generowanych pól i zapisywaniem danych do tablicy.
Btw, przy okazji pousuwaj komentarze - nie wnoszą one nic nowego do kodu, a jedynie utrudniają jego czytanie.