Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> Dodanie tekstu w js
gregi1
post
Post #1





Grupa: Zarejestrowani
Postów: 134
Pomógł: 0
Dołączył: 24.03.2007

Ostrzeżenie: (0%)
-----


Pytanie mam funkcje:

  1. function dodaj_element(kontener){
  2. var znacznik = document.createElement('input');
  3.  
  4. znacznik.setAttribute('type', 'text');
  5. znacznik.setAttribute('name', 'Imie');
  6.  
  7. znacznik.className = 'upload';
  8.  
  9. var kontener = document.getElementById(kontener);
  10. kontener.appendChild(znacznik);
  11.  
  12. }
  13. //-->


I moje pytanie jest jak z lewej strony tego inputa wyswietlic jakis tekst. Np. Podaj imie...
Go to the top of the page
+Quote Post
 
Start new topic
Odpowiedzi
vokiel
post
Post #2





Grupa: Zarejestrowani
Postów: 2 592
Pomógł: 445
Dołączył: 12.03.2007

Ostrzeżenie: (0%)
-----


Żadnej tabelki nie potrzebujesz, css wystarczy
ustawiasz parametry dla label i input, wszystko razem jeszcze wrzucasz w div.
  1. <div class="holder"><label for="input_1">Input 1</label><input id="input_1" class="upload" /></div>
  2. <style type="text/css">
  3. .holder {clear: both; width: 600px;}
  4. .holder label{width: 300px; float: left; display: inline;}
  5. .holder input{display: inline;}
  6. <div>
  7. <div class="holder"><label for="input_1">Input 1</label><input id="input_1" class="upload" /></div>
  8. <div class="holder"><label for="input_2">Input 1</label><input id="input_2" class="upload" /></div>
  9. <div class="holder"><label for="input_3">Input 1</label><input id="input_3" class="upload" /></div>
  10. <div class="holder"><label for="input_4">Input 1</label><input id="input_4" class="upload" /></div>
  11. <div class="holder"><label for="input_5">Input 1</label><input id="input_5" class="upload" /></div>
  12. </div>


Tworzenie inputow wraz z przyciskami do ich usuwania. Tworzysz linki a href z klasą add oraz id z nazwa kontenera.
  1. <a href="#" class="add" id="id_kontenera" title="Dodaj nowy input" >dodaj</a>
  2. <script type="text/javascript">
  3. $(document).ready(
  4. function(){
  5. $("a.add").click(function(){
  6. // pobierasz id kontenera
  7. var kontener = $(this).attr('id');
  8. // tworzysz diva (kontenera dla lablela inputa i linku do usuniecia
  9. var new_div = '<div class="holder">';
  10. // tworzysz label i inputa
  11. var new_label_input = '<label for="input_1">Input 1</label><input id="input_1" class="upload" />';
  12. // tworzysz nowy link
  13. var new_link = $('<a href="#" >usun</a>');
  14. // dodajesz funkcje ktora po kliknieciu w link usunie parent div (czyli calego diva z labelem inputem i tym kliknietym a)
  15. new_link.click(function(){
  16. $(this).parent("div").remove();
  17. return false;
  18. });
  19. // dodajesz do diva lablel i input
  20. new_div.append(new_label_input);
  21. // dodajesz do diva link
  22. new_div.append(new_link);
  23. // dodajesz do kontenera caly div
  24. $('#'+kontener).append(new_div);
  25. return false;
  26. });
  27. });
Go to the top of the page
+Quote Post
gregi1
post
Post #3





Grupa: Zarejestrowani
Postów: 134
Pomógł: 0
Dołączył: 24.03.2007

Ostrzeżenie: (0%)
-----


Cytat(vokiel @ 14.11.2008, 12:05:59 ) *
Żadnej tabelki nie potrzebujesz, css wystarczy
ustawiasz parametry dla label i input, wszystko razem jeszcze wrzucasz w div.
  1. <div class="holder"><label for="input_1">Input 1</label><input id="input_1" class="upload" /></div>
  2. <style type="text/css">
  3. .holder {clear: both; width: 600px;}
  4. .holder label{width: 300px; float: left; display: inline;}
  5. .holder input{display: inline;}
  6. <div>
  7. <div class="holder"><label for="input_1">Input 1</label><input id="input_1" class="upload" /></div>
  8. <div class="holder"><label for="input_2">Input 1</label><input id="input_2" class="upload" /></div>
  9. <div class="holder"><label for="input_3">Input 1</label><input id="input_3" class="upload" /></div>
  10. <div class="holder"><label for="input_4">Input 1</label><input id="input_4" class="upload" /></div>
  11. <div class="holder"><label for="input_5">Input 1</label><input id="input_5" class="upload" /></div>
  12. </div>


Czyli co to normalnie mam wrzucic do html w miejscy gdzie chce aby te inputy sie pojawily?
Ale ten div nie bedzie widoczny dopuki nie klikne dodaj nowy input?
Cytat
Tworzenie inputow wraz z przyciskami do ich usuwania. Tworzysz linki a href z klasą add oraz id z nazwa kontenera.
  1. <a href="#" class="add" id="id_kontenera" title="Dodaj nowy input" >dodaj</a>
  2. <script type="text/javascript">
  3. $(document).ready(
  4. function(){
  5. $("a.add").click(function(){
  6. // pobierasz id kontenera
  7. var kontener = $(this).attr('id');
  8. // tworzysz diva (kontenera dla lablela inputa i linku do usuniecia
  9. var new_div = '<div class="holder">';
  10. // tworzysz label i inputa
  11. var new_label_input = '<label for="input_1">Input 1</label><input id="input_1" class="upload" />';
  12. // tworzysz nowy link
  13. var new_link = $('<a href="#" >usun</a>');
  14. // dodajesz funkcje ktora po kliknieciu w link usunie parent div (czyli calego diva z labelem inputem i tym kliknietym a)
  15. new_link.click(function(){
  16. $(this).parent("div").remove();
  17. return false;
  18. });
  19. // dodajesz do diva lablel i input
  20. new_div.append(new_label_input);
  21. // dodajesz do diva link
  22. new_div.append(new_link);
  23. // dodajesz do kontenera caly div
  24. $('#'+kontener).append(new_div);
  25. return false;
  26. });
  27. });


Ale ta funkcje dodaj_element(kontener) musze tez miec?
Go to the top of the page
+Quote Post

Posty w temacie
- gregi1   Dodanie tekstu w js   12.11.2008, 22:53:55
- - melkorm   przed "wkładaniem" inputa możesz dać: K...   13.11.2008, 00:24:16
- - gregi1   Pomoglo tylko czesciowo bo moge wstawic ten kod ty...   13.11.2008, 09:00:55
- - nospor   tekst dodajesz na identycznej zasadzie co inputa -...   13.11.2008, 09:14:49
- - gregi1   Pewnie ze przyjemniej ale ja jestem kompletnym lai...   13.11.2008, 09:35:14
- - nospor   http://docs.jquery.com/How_jQuery_Works czyli stan...   13.11.2008, 09:40:47
- - vokiel   Jak już dodajesz inputa, to zamiast paragrafu lepi...   13.11.2008, 10:36:48
- - gregi1   To jeszcze jedno pytanie jest dodaje sobie kilka p...   13.11.2008, 21:10:29
- - vokiel   Żadnej tabelki nie potrzebujesz, css wystarczy ust...   14.11.2008, 12:05:59
|- - gregi1   Cytat(vokiel @ 14.11.2008, 12:05:59 )...   14.11.2008, 12:36:36
- - vokiel   Nie tej funkcji już nie musisz mieć, tak...   14.11.2008, 14:40:07
- - gregi1   Wiesz co nie wiem czy dobrze to zrobilem ale moja ...   14.11.2008, 16:32:15
- - vokiel   Rzeczywiście nie mogło działać, przy tworzeniu div...   15.11.2008, 15:03:20
- - gregi1   Wielkie dzieki, pomoglo. Nawet wiedzialem jak prze...   16.11.2008, 11:06:37
- - vokiel   Cytat(gregi1 @ 16.11.2008, 11:06:37 )...   17.11.2008, 10:05:51
- - gregi1   Wiesz co jestem kompletnym laikiem ale nie dziala ...   17.11.2008, 14:46:33
- - vokiel   [HTML] pobierz, plaintext <!DOCTYPE HTML PUBLIC...   21.11.2008, 11:26:12
- - gregi1   Wielkie dzieki za pomoc, to mam jeszcze prosbe, po...   26.11.2008, 19:16:29
- - erix   http://www.sitepoint.com/article/ajax-jquery/   27.11.2008, 18:15:46
- - gregi1   Cytat(erix @ 27.11.2008, 18:15:46 ) h...   27.11.2008, 22:05:05
- - erix   To w click. Kod$.get('link.php',...   27.11.2008, 22:14:13
- - gregi1   Cytat(erix @ 27.11.2008, 22:14:13 ) T...   28.11.2008, 14:29:37
- - erix   http://docs.jquery.com/Main_Page Poszukaj, bo mi ...   28.11.2008, 14:33:20


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

 



RSS Aktualny czas: 28.09.2025 - 12:54