Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [js] dołączanie wielu plików
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
leos
Witam,
Prosze o jakies wskazówki jakzmodyfikować ten skrypt, aby po kliknieciu na załącz kolejny plik wyskakiwała nowa linia z polem na plik oraz polem do ktorego moge wprowadzic jakas liczbe

oto skrypt js:

Kod
<script type="text/javascript">
    <!--
    function dodaj_element(kontener){
       var znacznik = document.createElement('input');
       znacznik.setAttribute('type', 'file');
       znacznik.setAttribute('name', 'plik[]');
       var kontener = document.getElementById(kontener);
       kontener.appendChild(znacznik);
    }
    //-->
    </script>



oraz formularz html:

Kod
<form enctype="multipart/form-data" method=post action="add_foto.php">
  <table bgcolor=#cccccc>
  <tr>
     <td>Zdjęcie</td>
     <td>Ilość:</td>
  </tr>
  <div id="pliki">
  <tr>
     <td><input type="file" name="plik[]" /></td>
     <td><input type="text" name="ile[]" size="3" /></td>
  </tr>
    </div>
    </table>
    <div>
        <input type="button" value="Załącz kolejny plik" onclick="dodaj_element('pliki');" />
        <input type="submit" value="Wyślij" />
    </div>
  </form>



Probowalem dodawac do skryptu js znacznik2, ale nic to nie dalo

Kod
var znacznik2 = document.createElement('input');

       znacznik.setAttribute('type', 'text');

       znacznik.setAttribute('name', 'ile[]');



Jesli ktos ma jakis pomysl bede wdzieczny
lord_t
Wydaje mi się, że dobrze kombinujesz. tylko czemu w

  1. znacznik.setAttribute('type', 'text');
  2. znacznik.setAttribute('name', 'ile[]');


przypisujesz do znacznika a nie do znacznika2?
leos
Głupi blad zrobilem...
Mam teraz:
Kod
<script type="text/javascript">
    <!--
    function dodaj_element(kontener){
       var znacznik = document.createElement('input');
       znacznik.setAttribute('type', 'file');
       znacznik.setAttribute('name', 'plik[]');
       var znacznik2 = document.createElement('input');
       znacznik2.setAttribute('type', 'text');
       znacznik2.setAttribute('name', 'ile[]');
       znacznik2.setAttribute('size', '3');
       var kontener = document.getElementById(kontener);
       kontener.appendChild(znacznik);
       kontener.appendChild(znacznik2);
    }
    //-->
    </script>



Wyswietlaja mi sie juz 2 takie okienka jakbym chcial, ale jak zrobic, aby byly one dodawane do tablicy, lub chocby dodawane pod tablica
lord_t
  1. <script type="text/javascript">
  2. <!--
  3. function dodaj_element(kontener){
  4. var znacznik = document.createElement('input');
  5. znacznik.setAttribute('type', 'file');
  6. znacznik.setAttribute('name', 'plik[]');
  7. var znacznik2 = document.createElement('input');
  8. znacznik2.setAttribute('type', 'text');
  9. znacznik2.setAttribute('name', 'ile[]');
  10. znacznik2.setAttribute('size', '3');
  11.  
  12. var elemTR=document.createElement('tr');
  13. var elemTD1=document.createElement('td');
  14. var elemTD2=document.createElement('td');
  15. elemTD1=appendChild(znacznik);
  16. elemTD2=appendChild(znacznik2);
  17. elemTR=appendChild(elemTD1);
  18. elemTR=appendChild(elemTD2);
  19. var kontener = document.getElementById(kontener);
  20. kontener.appendChild(elemTR);
  21. }
  22. //-->
  23. </script>


Coś takiego^ . Pisane z palca.

Ale mam uwagi do kodu: Wstawienie diva pomiedzy wiersze tabeli wydaje mi się niepoprawne i chyba takie jest.
Ja bym przeniósł id='pliki' do <table> a diva o tym id wyrzucił.
leos
Nie dziala ten kod JS.
Zrobilem z tym div-em jak pisales, teraz juz wyswietla sie wszystko w tabeli, ale nie jest sformatowane. Po dodaniu nowego pliku tablica sie rozsuwa
lord_t
Eh.. Pisało, że kod był z palca (czyt. z pamięci). Pomyliłem się trochę z znakami =.
Wersja poprawiona poniżej. A na przyszłość korzystaj z FireBug (wtyczka do FF), jakbyś miał to od razu wyłapiesz, gdzie się pomyliłem.

  1. function dodaj_element(kontener){
  2. var znacznik = document.createElement('input');
  3. znacznik.setAttribute('type', 'file');
  4. znacznik.setAttribute('name', 'plik[]');
  5. var znacznik2 = document.createElement('input');
  6. znacznik2.setAttribute('type', 'text');
  7. znacznik2.setAttribute('name', 'ile[]');
  8. znacznik2.setAttribute('size', '3');
  9.  
  10. var elemTR=document.createElement('tr');
  11. var elemTD1=document.createElement('td');
  12. var elemTD2=document.createElement('td');
  13. elemTD1.appendChild(znacznik);
  14. elemTD2.appendChild(znacznik2);
  15. elemTR.appendChild(elemTD1);
  16. elemTR.appendChild(elemTD2);
  17. var kontener = document.getElementById(kontener);
  18. kontener.appendChild(elemTR);
  19. }
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.