Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [jQuery] Dodawanie i usuwanie inputów
shpaque
post 12.06.2018, 10:40:42
Post #1





Grupa: Zarejestrowani
Postów: 651
Pomógł: 3
Dołączył: 31.01.2011
Skąd: Warszawa

Ostrzeżenie: (10%)
X----


Witam serdecznie,
dzisiaj borykam się z czymś, czego nigdy wcześniej nie robiłem - chcę przy każdym "row" aby była możliwość dodania następnego rowa i jego usunięcia. Konsola wywala 78 bledow typu:
  1. Uncaught SyntaxError: Invalid or unexpected token
  2. index.php:548 Uncaught ReferenceError: addMoreRows is not defined
  3. at HTMLAnchorElement.onclick


kod jest mieszany php + jquery i szczerze mówiąc już się zamotałem jak to zrobić, żeby dobrze wyszło, wygląda to tak:

  1. for ($y = 0; $y < $countLinks; $y++)
  2. {
  3. echo "
  4. <div class=\"row\" style=\"margin-top: 2px;\" id=\"rowLink".$y."\">
  5. <div class=\"col-sm-8\">
  6. <input class=\"form-control text-center\" type=\"text\" name=\"mainTitle".$x."-linkTitle".$y."\" value=\"".$c -> main[$x] -> link[$y] -> title."\" required />
  7. </div>
  8. <div class=\"col-sm-2\">
  9. <input class=\"form-control text-center\" type=\"text\" name=\"mainPage".$x."-linkPage".$y."\" value=\"".$c -> main[$x] -> link[$y] -> page."\" required />
  10. </div>
  11. <div class=\"col-sm-1\">
  12. <a href=\"java script: void(0);\" class=\"btn btn-md text-center btn-delete\" type=\"button\" style=\"width: 100%;\" onclick=\"removeRow('+rowCount+');\"><span class=\"fa fa-remove icon-md\" title=\"Usuń ten link\"></span></a>
  13. </div>
  14. <div class=\"col-sm-1\">
  15. <a class=\"btn btn-md text-center btn-add\" style=\"width: 100%;\" onclick=\"addMoreRows();\"><span class=\"fa fa-plus icon-md\" title=\"Dodaj link\"></span></a>
  16. </div>
  17. </div>
  18. ";
  19.  
  20. // Skrypt dodający i usuwający link
  21. $z = $y++;
  22. echo "
  23. <script>
  24. var rowCount = ".$y.";
  25. function addMoreRows(frm) {
  26. rowCount ++;
  27. var recRow = ' <div class=\"row\" style=\"margin-top: 2px;\" id=\"rowLink'+rowCount+'\">
  28. <div class=\"col-sm-8\">
  29. <input class=\"form-control text-center\" type=\"text\" name=\"mainTitle".$x."-linkTitle".$z."\" required />
  30. </div>
  31. <div class=\"col-sm-2\">
  32. <input class=\"form-control text-center\" type=\"text\" name=\"mainPage".$x."-linkPage".$z."\" required />
  33. </div>
  34. <div class=\"col-sm-1\">
  35. <a href=\"java script: void(0);\" onclick=\"removeRow('+rowCount+');\">Delete</a>
  36. </div>
  37. </div>';
  38.  
  39. $('#rowLink".$y."').append(recRow);
  40. }
  41.  
  42. function removeRow(removeNum) {
  43. $('#rowLink".$z."' + removeNum).remove();
  44. }
  45. </script>
  46. ";
  47.  
  48. }
Go to the top of the page
+Quote Post
 
Start new topic
Odpowiedzi
shpaque
post 14.06.2018, 10:09:02
Post #2





Grupa: Zarejestrowani
Postów: 651
Pomógł: 3
Dołączył: 31.01.2011
Skąd: Warszawa

Ostrzeżenie: (10%)
X----


ok zadzialalo tak

  1. // Skrypt usuwający link
  2. function removeRow(row) {
  3. var catNumber = $(row).data('rowCat');
  4. var mainNumber = $(row).data('rowMain');
  5. var linkNumber = $(row).data('rowLink');
  6.  
  7. $('#cat' + catNumber + 'main' + mainNumber).find('.row:last-child').remove();
  8. return false;
  9. }



teraz tylko zeby 1 zawsze zostal

pewnie cos takiego trzeba
  1. function removeRow(row) {
  2. var catNumber = $(row).data('rowCat');
  3. var mainNumber = $(row).data('rowMain');
  4.  
  5. if ($('#cat' + catNumber + 'main' + mainNumber).not('.row:first-child')){
  6. $('#cat' + catNumber + 'main' + mainNumber).find('.row:last-child').remove();}
  7. return false;
  8. }

no ale takie kombinowanie nie dziala

@EDIT

mam to! dziękuję

  1. function removeRow(row) {
  2. var catNumber = $(row).data('rowCat');
  3. var mainNumber = $(row).data('rowMain');
  4.  
  5. $('#cat' + catNumber + 'main' + mainNumber).find('.row:last-child').not('.row:first-child').remove();
  6. return false;
  7. }


to teraz ,a, amnalogiczna rzecz:

  1. // Skrypt dodający rozdział
  2. var n = 1;
  3. function addMain(row) {
  4. var catNumber = $(row).data('rowCat');
  5. var mainNumber = $(row).data('rowCount');
  6. var x = mainNumber + n;
  7. var newMain = $('#cat' + catNumber);
  8.  
  9. $('<div class="row rozdzial" style="margin-bottom: 5px;"><div class="col-sm-8"><div class="form-group"><label>Tytuł rozdziału</label><input class="form-control text-center" type="text" name="mainTitle[]" required /></div></div><div class="col-sm-2"><div class="form-group"><label>Strona rozdziału</label><input class="form-control text-center" type="text" name="mainPage[]" required /></div></div><div class="col-sm-1"><div class="form-group"><label>Usuń rozdział</label><button class="btn btn-md text-center btn-delete" style="width: 100%; height: 100%;" data-row-cat=' + x + ' data-row-main=' + x + ' onclick="return removeMain(this);"><span class="fa fa-remove icon-md" title="Usuń rozdział"></span></button></div></div><div class="col-sm-1"><div class="form-group"><label>Dodaj rozdział</label><button class="btn btn-md text-center btn-add" style="width: 100%; height: 100%;" data-row-cat=' + x + ' data-row-main=' + x + ' onclick="return addMain(this);"><span class="fa fa-plus icon-md" title="Dodaj rozdział"></span></button></div></div></div><div id="cat' + catNumber + 'main' + x + '"><div class="row"><div class="col-sm-8"><input class="form-control text-center" type="text" name="linkTitle[]" required /></div><div class="col-sm-2"><input class="form-control text-center" type="text" name="linkPage[]" required /></div><div class="col-sm-1"><button class="btn btn-md text-center btn-delete" style="width: 100%; height: 100%;" data-row-cat="' + catNumber + '" data-row-main="0" onclick="return removeRow(this);"><span class="fa fa-remove icon-md" title="Usuń link"></span></button></div><div class="col-sm-1"><button class="btn btn-md text-center btn-add" style="width: 100%; height: 100%;" data-row-cat="' + catNumber + '" data-row-main="0" onclick="return addRow(this);"><span class="fa fa-plus icon-md" title="Dodaj link"></span></button></div></div></div>').appendTo(newMain);
  10. n++;
  11. return false;
  12. }


@EDIT

ok tam juz poprawione, musialem dodac zmienna "n", pierwszy raz bedzie ok, ale przy kolejnym tworze n wychodzi mi NaN

  1. var n = 0;
  2. function addMain(row) {
  3. var catNumber = $(row).data('rowCat');
  4. var rowCount = $(row).data('rowCount');
  5. var mainNumber = rowCount + n;
  6. var newMain = $('#cat' + catNumber);
  7.  
  8. $('<div class="row rozdzial" style="margin-bottom: 5px;"><div class="col-sm-8"><div class="form-group"><label>Tytuł rozdziału</label><input class="form-control text-center" type="text" name="mainTitle[]" required /></div></div><div class="col-sm-2"><div class="form-group"><label>Strona rozdziału</label><input class="form-control text-center" type="text" name="mainPage[]" required /></div></div><div class="col-sm-1"><div class="form-group"><label>Usuń rozdział</label><button class="btn btn-md text-center btn-delete" style="width: 100%; height: 100%;" data-row-cat=' + catNumber + ' data-row-main=' + mainNumber + ' onclick="return removeMain(this);"><span class="fa fa-remove icon-md" title="Usuń rozdział"></span></button></div></div><div class="col-sm-1"><div class="form-group"><label>Dodaj rozdział</label><button class="btn btn-md text-center btn-add" style="width: 100%; height: 100%;" data-row-cat=' + catNumber + ' data-row-main=' + mainNumber + ' onclick="return addMain(this);"><span class="fa fa-plus icon-md" title="Dodaj rozdział"></span></button></div></div></div><div id="cat' + catNumber + 'main' + mainNumber + '"><div class="row"><div class="col-sm-8"><input class="form-control text-center" type="text" name="linkTitle[]" required /></div><div class="col-sm-2"><input class="form-control text-center" type="text" name="linkPage[]" required /></div><div class="col-sm-1"><button class="btn btn-md text-center btn-delete" style="width: 100%; height: 100%;" data-row-cat="' + catNumber + '" data-row-main=' + mainNumber + ' onclick="return removeRow(this);"><span class="fa fa-remove icon-md" title="Usuń link"></span></button></div><div class="col-sm-1"><button class="btn btn-md text-center btn-add" style="width: 100%; height: 100%;" data-row-cat="' + catNumber + '" data-row-main=' + mainNumber + ' onclick="return addRow(this);"><span class="fa fa-plus icon-md" title="Dodaj link"></span></button></div></div></div>').appendTo(newMain);
  9. n++;
  10. return false;
  11. }


Ten post edytował shpaque 14.06.2018, 10:18:12
Go to the top of the page
+Quote Post

Posty w temacie
- shpaque   [jQuery] Dodawanie i usuwanie inputów   12.06.2018, 10:40:42
- - nospor   Masz bledy w funkcji addMoreRows() temu ta funkcja...   12.06.2018, 10:46:41
- - shpaque   ale jakos to sie da zrobic , chce caly row zrobic ...   12.06.2018, 13:30:22
- - nospor   Cytatzacznijmy od początku (mój monolog) - dlaczeg...   12.06.2018, 15:06:02
- - shpaque   ...ale kliekniete raz... to petla nadrzedna i to ...   12.06.2018, 15:15:16
- - nospor   Cytat...ale kliekniete raz... "Uwielbiam...   12.06.2018, 15:19:03
- - shpaque   to bylo w miedzyczasie dla testu - caly czas jest ...   12.06.2018, 15:30:21
- - nospor   No i jeszcze tworzysz jakis testowy kod ktory zara...   12.06.2018, 15:30:35
- - shpaque   no dobrze to wiem, ze logika sie nie zmienia, ale ...   13.06.2018, 11:59:08
- - Neutral   Czy chodzi Ci o te linie pod script? Jeśli tak, to...   13.06.2018, 12:05:33
- - nospor   Cytatdlaczego nikt nie jest mi w stanie pomoc?Nie ...   13.06.2018, 12:07:40
- - shpaque   czyli wyjsc z petli dac skrypt na sam koniec dokum...   13.06.2018, 12:15:34
- - nospor   No i wlasnie to jest to o czym mowilem. NIe slucha...   13.06.2018, 12:17:28
- - shpaque   czyli od poczatku a ma byc w tylu: [PHP] pobierz,...   13.06.2018, 12:22:26
- - nospor   Tak. Tylko do addRow() masz przekazac referencje ...   13.06.2018, 12:25:53
- - shpaque   [HTML] pobierz, plaintext <script>function a...   13.06.2018, 13:56:52
- - nospor   Cytata teraz zupelnie nie wiem co i dlaczegoWtedy ...   13.06.2018, 14:07:05
- - shpaque   ok czyli wracamy do wersji poprzedniej cos z tym ...   13.06.2018, 14:46:20
- - nospor   Przeczytaj jeszcze raz uwaznie moj poprzedni post....   13.06.2018, 14:48:54
- - shpaque   return addRow(this) - zrobiony .data() dodany oncl...   13.06.2018, 14:54:37
- - nospor   Cytatczego nie doczytalemA tego ci nie powiem bo z...   13.06.2018, 14:55:31
- - shpaque   dobra przerobilem sobie html zeby jedna para butto...   13.06.2018, 15:17:37
- - nospor   Juz ci chyba kiedys pisalem, ze rowy to mozesz kop...   13.06.2018, 15:31:24
- - shpaque   teraz musze dorobic opcje usuniecia analogicznie i...   13.06.2018, 21:14:23
- - Pyton_000   https://stackoverflow.com/questions/1887429...t-fo...   13.06.2018, 21:20:22
- - shpaque   ok zadzialalo tak [HTML] pobierz, plaintext // Sk...   14.06.2018, 10:09:02
- - Neutral   Napisz może parseInt lub parseFloat.   14.06.2018, 11:01:40
- - shpaque   nie dzialaja jak to zrobic? [HTML] pobierz, plai...   14.06.2018, 17:34:27
- - Neutral   Nie jestem pewien, ale może to pójdzie: Kodvar mai...   14.06.2018, 22:52:44
- - shpaque   wtedy dostaje tak: pierwszy generowany ma id ...   15.06.2018, 09:13:41


Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 28.03.2024 - 14:09