Ta strona używa ciasteczek (cookies), dzięki którym nasz serwis może działać lepiej. Dowiedz się więcej OK, rozumiem

Wykorzystanie parametru funkcji w pętli for

Tworzenie dynamicznych stron internetowych z zastosowaniem JavaScript, jQuery, Ajax. Dowiedz się jak to zrobić, znajdź rozwiązania swoich problemów.

Wykorzystanie parametru funkcji w pętli for

Post 01.10.2015, 21:08:11

Witam,
dopiero zaczynam uczyć się JS i nie wiem jak rozwiązać myślę prosty dla was problem, proszę o pomoc. Chodzi o skopiowanie wszystkich pól z jednego formularza do drugiego za pomocą zaznaczenia checkboxa.

Zrobiłem tak:
Kod: Zaznacz cały
<script language="JavaScript">
function przepisz()

   if(!document.form2.pole1.value)document.form2.pole1.value=document.form1.pole1.value;
   else document.form2.pole1.value='';
   
   if(!document.form2.pole2.value)document.form2.pole2.value=document.form1.pole2.value;
   else document.form2.pole2.value='';
   
   if(!document.form2.pole3.value)document.form2.pole3.value=document.form1.pole3.value;
   else document.form2.pole3.value='';
   
   if(!document.form2.pole4.value)document.form2.pole4.value=document.form1.pole4.value;
   else document.form2.pole4.value='';
}
</script>

<form name="form1">
<input type="text" name="pole1">
<input type="text" name="pole2">
<input type="text" name="pole3">
<input type="text" name="pole4">
</form>

<form name="form2">
<input type="checkbox" onChange="przepisz()">
<input type="text" name="pole1">
<input type="text" name="pole2">
<input type="text" name="pole3">
<input type="text" name="pole4">
</form>

Próbuję zrobić to w pętli dzięki przekazaniu parametru liczba_pol:
Kod: Zaznacz cały
function przepisz(liczba_pol)
{
  for (i = 1; i <= liczba_pol; i++)
  {
     // nie wiem co tutaj
  }
}

Wtedy w form2 (dobrze?):
Kod: Zaznacz cały
<input type="checkbox" onChange="przepisz(4)">
plama331
Posty: 9
Dołączył(a): 01.10.2015

Re: Wykorzystanie parametru funkcji w pętli for

Post 01.10.2015, 21:20:57

Kod: Zaznacz cały
document.getElementsByName('pole'+i)
Taka mała podpowiedź;)
https://audioforum.net.pl - forum głosowe, spotkania przez Internet

Tworzę strony/aplikacje internetowe w Laravel i WordPress! Zainteresowanych zapraszam na PW
Avatar użytkownikaMrKlikacz
Web Artisan

Posty: 401
Dołączył(a): 04.05.2011
Lokalizacja: Rybnik

Re: Wykorzystanie parametru funkcji w pętli for

Post 01.10.2015, 21:37:49

Kod: Zaznacz cały
function przepisz(liczba_pol) {
    for (i = 1; i <= liczba_pol; i++) {
        if (!document.forms['form2'].elements['pole' + i].value) {
           document.forms['form2'].elements['pole' + i].value = document.forms['form1'].elements['pole' + i].value;
        }
    }
}
?
Avatar użytkownikakuku
Rafał Kukawski

+∞
+∞

Posty: 19409
Dołączył(a): 14.04.2002

Re: Wykorzystanie parametru funkcji w pętli for

Post 01.10.2015, 22:32:37

Dziękuje bardzo!
plama331
Posty: 9
Dołączył(a): 01.10.2015

Re: Wykorzystanie parametru funkcji w pętli for

Post 02.10.2015, 18:00:42

Niestety muszę jednak w tej funkcji wykorzystać parametr "id" w polach input oraz formularzach, a nie "name".
Czyli formularze wyglądają tak:
Kod: Zaznacz cały
<form id="form1">
<input type="text" id="pole1">
...

Jak ją przerobić?
plama331
Posty: 9
Dołączył(a): 01.10.2015

Re: Wykorzystanie parametru funkcji w pętli for

Post 02.10.2015, 18:27:47

Ale jak ma to działać z ID? Dane id może w dokumencie istnieć tylko raz. Więc jak ma wyglądać logika powiązań id z jednego formularza z id elementów w drugim formularzu?
Avatar użytkownikakuku
Rafał Kukawski

+∞
+∞

Posty: 19409
Dołączył(a): 14.04.2002

Re: Wykorzystanie parametru funkcji w pętli for

Post 02.10.2015, 19:23:30

Tak to widzę:
Kod: Zaznacz cały
<form id="form1">
<input type="text" id="pole11">
<input type="text" id="pole12">
<input type="text" id="pole13">
</form>

<form id="form2">
<input type="checkbox" onChange="przepisz()">
<input type="text" id="pole21">
<input type="text" id="pole22">
<input type="text" id="pole23">
</form>
plama331
Posty: 9
Dołączył(a): 01.10.2015

Re: Wykorzystanie parametru funkcji w pętli for

Post 02.10.2015, 21:19:04

Kod: Zaznacz cały
function przepisz(liczba_pol) {
    for (i = 1; i <= liczba_pol; i++) {
        if (!document.getElementById('pole2' + i).value) {
           document.getElementById('pole2' + i).value = document.getElementById('pole1' + i).value;
        }
    }
}
Avatar użytkownikakuku
Rafał Kukawski

+∞
+∞

Posty: 19409
Dołączył(a): 14.04.2002

Re: Wykorzystanie parametru funkcji w pętli for

Post 02.10.2015, 21:52:15

Tak zrobiłem i ładnie kopiuje, ale jak odznaczę checkboxa to nie czyści mi pól w form2, a czyściło poprzednim sposobem.

Ajjj... przecież wystarczy dodać else:
Kod: Zaznacz cały
else document.getElementById('pole2' + i).value = '';

i już czyści. Dzięki za pomoc!
plama331
Posty: 9
Dołączył(a): 01.10.2015

Re: Wykorzystanie parametru funkcji w pętli for

Post 06.10.2015, 19:25:00

Skrypt wywoływany onChange bez brania pod uwagę czy zmieniło się na checked czy unchecked nie do końca mi dobrze działa przy przeładowaniu formularza w wyniku niespełniania wszystkich reguł walidacji. Jak zrobić żeby brał to pod uwagę czyli żeby wyglądał mniej więcej tak:
Kod: Zaznacz cały
function przepisz(liczba_pol)
{
    if (document.getElementById('checkbox1').checked)  // gdzie "checbox1" to id checkbox'a
    {
        for (i = 1; i <= liczba_pol; i++)
        {
           document.getElementById('pole2' + i).value = document.getElementById('pole1' + i).value;
        }
    }
    else
    {
        for (i = 1; i <= liczba_pol; i++)
        {
            document.getElementById('pole2' + i).value = '';
        }
     }
}

Oczywiście powyższy kod w ogóle nie działa - jak zastąpić to moje ".checked" ?
plama331
Posty: 9
Dołączył(a): 01.10.2015

Re: Wykorzystanie parametru funkcji w pętli for

Post 07.10.2015, 13:20:14

Już nieważne poradziłem sobie, może się komuś przyda:
JS:
Kod: Zaznacz cały
function przepisz(liczba_pol, checkbox)
{
    if (checkbox.checked)
    {
        for (i = 1; i <= liczba_pol; i++)
        {
           document.getElementById('pole2' + i).value = document.getElementById('pole1' + i).value;
        }
    }
    else
    {
        for (i = 1; i <= liczba_pol; i++)
        {
            document.getElementById('pole2' + i).value = '';
        }
    }
}

HTML:
Kod: Zaznacz cały
<input type="checkbox" name="checkbox1" onClick="przepisz(10, this)"
plama331
Posty: 9
Dołączył(a): 01.10.2015


Powrót do JavaScript


 


  • Podobne wątki
    Odpowiedzi
    Wyświetlone
    Ostatni post

Kto przegląda forum

Użytkownicy przeglądający ten dział: Ahrefs [Bot], Bing [Bot] i 6 gości

Hosting, Domeny, SSL
iCash

Subskrypcja

Mamy 49632 zarejestrowanych użytkowników.
Najnowszy użytkownik: KashaCzq


Nasi użytkownicy napisali:

  • 933822 wiadomości
  • w 245890 tematach

Najnowsze wpisy na blogu

Najnowsze artykuły

Najaktywniejsi (ostatnie 30 dni)