[Tutorial JS] Injectarea unui text intr-un camp textarea

#1
Nume Tutorial: Injectarea unui text intr-un camp textarea
Descriere: Injectarea unui text intr-un camp textarea
Download:
Autor: Anonim
Sursa (Link-ul oficial):
tutorialeonline
Propria parere: Folositor.
Tutorialul:

Zilele trecute am avut nevoie de o funcţie în javascript care sa injecteze un text într-un câmp din formular. După ceva bătaie de cap a reieşit exemplul de mai jos:

Cod: Selectaţi tot

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 <title>Untitled Document</title>
 <script language="JavaScript" type="text/javascript">
 <!--
 function injecteaza_text(mesaj, id1, id2) {
    var ceva = document.getElementById(id1);
    var altceva = document.getElementById(id2);
    var cevaHidden = document.getElementById(id1+'1');
 
    if(altceva.checked == true) {
       cevaHidden.value = ceva.value;
       ceva.value = cevaHidden.value+' '+mesaj;
    }
    else {
       ceva.value = cevaHidden.value;
    }
 }
 -->
 </ script>
 </head>
 
 <body>
    <form id="form1" name="form1" method="post" action="">
       <input type="text" name="camp_1" id="camp_1" value="valoare1" />
       <input type="hidden" name="camp_11" id="camp_11" value="" />
       Injecteaza text
       <input type="checkbox" name="checkbox" value="checkbox" id="inject_1"
          onclick="injecteaza_text('acesta este un text introdus in textarea 1',
          'camp_1', 'inject_1')" /><br />
       <input type="text" name="camp_2" id="camp_2" value="valoare2" />
       <input type="hidden" name="camp_21" id="camp_21" value="" />
       Injecteaza text
       <input type="checkbox" name="checkbox" value="checkbox" id="inject_2"
          onclick="injecteaza_text('acesta este un text introdus in textarea 2',
          'camp_2', 'inject_2')" /><br />
 
       <input type="text" name="camp_3" id="camp_3" value="valoare3" />
       <input type="hidden" name="camp_31" id="camp_31" value="" />
       Injecteaza text
       <input type="checkbox" name="checkbox" value="checkbox" id="inject_3"
          onclick="injecteaza_text('acesta este un text introdus in textarea 3',
          'camp_3', 'inject_3')" />
    </form>
 </body>
 </html>
După cum observaţi, în formular sunt 3 câmpuri de tip textarea în care se poate introduce orice text. Câmpurile de tip hidden memorează textul introdus în textarea. Dacă se bifează unul din cele 3 checkbox-uri se introduce pe lângă textul iniţial din textarea şi textul trimis ca parametru funcţiei javascript. În cazul în care se debifează checkbox-ul, atunci se preia textul original din câmpul hidden şi se pune înapoi în câmpul textarea. Funcţia javascript preia 3 parametrii şi anume primul parametru corespunde cu textul ce va fi injectat în câmpul specificat, în al doilea parametru (ca id). Al treilea parametru este id-ul câmpului de tip checkbox care se verifică în cadrul funcţiei dacă a fost bifat sau nu (rândul if(altceva.checked == true))
Ideea acestui script o puteţi aplica în diverse situaţii, de exemplu la un magazin virtual dacă vreţi să se adauge la produsele comandate încă un text anume sau la un program de facturare cum ar fi taxa pe timbru verde pentru anumite produse, sau alte situaţii de care o să vă loviţi la un moment dat...

Înapoi la “Tutoriale JS”

Cine este conectat

Utilizatori răsfoind acest forum: Niciun utilizator înregistrat și 2 vizitatori