Dynamiczne dodawanie wierszy za pomocą jQuery
Tworzę formularz, w którym potrzebuję kilku dodatkowych danych wejściowych i mam w zasadzie to:
https://i.stack.imgur.com/lWvUW.png
Za każdym razem, gdy użytkownik kliknie przycisk Plus, do formularza trzeba dodać nowy wiersz danych wejściowych, jak mogę to zrobić w jQuery?
Możliwe jest również automatyczne dodanie nowej linii, gdy wszystkie linie
(lub po prostu ostatnia linia, jeśli jest łatwiej/szybciej)
wypełniony?
Dzięki temu użytkownik nie musi naciskać przycisku Plus.
Przepraszam, że zadam może takie proste pytanie, ale nadal jestem bardzo zielony z jQuery, mógłbym to zrobić z PHP, ale jestem pewien, że Javascript/jQuery odgrywa tutaj lepszą rolę.
Z góry dziękuję!
@alex:
>
<!DOCTYPE html>
<head>
<script type="text/javascript" src="[url=http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>]http://ajax.googleapis.com/aja ... gt%3B[/url]
<script type="text/javascript">
$form = $('#personas');
$rows = $form.find('.person');$('a#add').click(function() {
$rows.find(':first').clone().insertAfter($rows.find(':last'));
$justInserted = $rows.find(':last');
$justInserted.hide();
$justInserted.find('input').val('');// it may copy values from first one
$justInserted.slideDown(500);
});
</script>
</head><body>
<form id="personas" name="personas" method="post" action="">
<table width="300" border="1" cellspacing="0" cellpadding="2">
<tr>
<td>Name</td>
<td>More?</td>
</tr>
<tr class="person">
<td><input type="text" name="name[]" id="name[]"/></td>
<td>[url="#" id="add">+[/url]</td>
</tr>
</table>
</form>
</body>
</html>
Nie znaleziono powiązanych wyników
Zaproszony:
Aby odpowiedzieć na pytania, Zaloguj się lub Zarejestruj się
5 odpowiedzi
Anonimowy użytkownik
Potwierdzenie od:
Tak wygląda znacznik HTML
Edytować
aby wyczyścić wartość pola tekstowego po wklejeniu.
EDIT2
nie mogłem sobie pomóc zresetować wszystkie listy rozwijane we wstawionym TR, możesz to zrobić
Resztę zostawiam tobie!
Anonimowy użytkownik
Potwierdzenie od:
<input name="someStuff.entry[2].fieldOne" id="someStuff_fdf_fieldOne_2" ..>
Zrobiłem to, ustawiając domyślną zmienną globalną na 0:
oraz w funkcji add po sklonowaniu i zrzuceniu wartości w nowej linii:
Anonimowy użytkownik
Potwierdzenie od:
to jest część html:
to jest część Javascript;
Na koniec PHP prześlij część:
więcej szczegółów znajdziesz w
dynamiczne wstawianie wierszy tabeli
https://www.iranthajayasekara. ... .html
Anonimowy użytkownik
Potwierdzenie od:
Zmień zgodnie z wymaganiami:
Jest to lepsze niż kopiowanie innerHTML, ponieważ utracisz wszystkie dołączone zdarzenia itp.
Anonimowy użytkownik
Potwierdzenie od: