Stergere mesaje de la inputuri formular cu Reset

Discutii si intrebari legate de scripturi si functii JavaScript, jQuery si Ajax, cod JavaScript in general.
nicusorilie
Mesaje:17

Stergere mesaje de la inputuri formular cu Reset

De ceva vreme ma tot chinui sa-i dau de cap si nu reusesc... si nu inteleg de ce nu functioneaza. Rog ajutor! Multumesc.

In pagina de Contact.php, am si un formular care functioneaza asa: introduc datele si apoi apas butonul trimite.

Daca toate campurile sunt corect completate, mesajul impreuna cu datele completate sunt trimise pe mail sub forma de mesaj (nimic neobisnuit pana aici). Si in dreptul fiecarui camp apare cate o bifa verde (un jpg).

Daca insa ceva nu e bine (format incorect sau camp lipsa (toate fiind obligatorii!)), apare mesaj cu rosu (text). Datele introduse anterior raman insa la ecran (nu dispar; nu trebuie introduse din nou).

Mai exista inca un buton care reseteaza valorile. Apare un mesaj de tip pop-up, de informare, ca datele introduse vor fi sterse. Daca apas ok, datele se sterg.

Problema este ca NU vor sa dispara mesajele de eroare cu rosu (daca sunt) sau acele bife cu verde (daca sunt). Datele introduse in input-uri (campuri) se sterg insa.

Codul arata cam asa:
In partea de <head> am asa:

Cod: Selectaţi tot

 <script type="text/javascript" language="javascript">
  function sterge()
  {
   var r=confirm("Toate datele introduse in formular vor fi sterse!");
   if (r==true) {
    var x=document.getElementsByTagName("input");
    for(var i=0; i<x.length; i++) {
     if(x[i].type == "text") {
      x[i].value= "";
     }
    }
    document.getElementById("mesaj").value="";
    nrcaractere();
    $('.err').css('display','none');
   }
  }
 </script>
Iar in partea de <body>, am asa:
- pentru validare, am un script php:

Cod: Selectaţi tot

<?php
            if (isset($_POST['trimite']))
             { $error = FALSE;

               if (empty($_POST['nume'])) {
                $errors['nume']='Camp obligatoriu';
                $error = TRUE;
               }
               else {       
                if (!preg_match('/^[a-zA-Z]{1,}$/',$_POST['nume'])) {
                 $errors['nume']='Numele trebuie sa contina doar litere';
                 $error = TRUE;
                } 
                 else {
                  $errors['nume']='<img src=/images/ok.jpg>';
                 }
               }
Si urmeaza si celelalte conditii similare (pentru prenume, tel, e-mail si verificare anti-bot (o suma).

- Apoi desenarea formularui:

Cod: Selectaţi tot

<form action="Contact.php" method="post">
  <table id="form">
   <tr>
    <td><label for="nume">Nume:&nbsp;<span style="color: red"><sup>*</sup></span>&nbsp;</label></td>
    <td><input type="text" name="nume" id="nume" maxlenght="20" value="<?php echo $_POST['nume']; ?>" /></td>
    <td><span class="err"><?php if(isset($errors['nume'])) { print $errors['nume']; } ?></span></td>
   </tr>
...
...
...           
   <tr>
    <td></td> 
    <td align="center">
     <button type="submit" name="trimite" title="Trimite mesajul" />Trimite</buton>
     <button type="button" name="reset" onClick="sterge()" title="Reseteaza toate campurile" />Reset</button></td>
    <td></td>
   </tr>
  </table>
 </form>
MarPlo Mesaje:4343
Salut
Butonul Reset sterge /reseteaza doar valorile din casute de formular. Daca acele mesaje sunt in alte tag-uri HTML, trebuie adaugate alte instructiuni in codul javascript ca sa stearga ce e in acele tag-uri cand se reseteaza formularul. Asta depinde cum sunt identificate acele elemente pt mesaje, cu un class sau ID.
De exemplu, daca mesajele de eroare sunt in element: <span class="err">...</span>
poti folosi in javascript acest cod:

Cod: Selectaţi tot

var elm_list = document.querySelectorAll('span .err');
var nr_elm = elm_list.length;
for(var i=0; i<nr_elm; i++) {
  elm_list[i].innerHTML = '';
}
- Este ca exemplu, daca stii JavaScript il poti adapta /folosi in scriptul tau.
nicusorilie Mesaje:17
Nu mi-a functionat. Probabil ca nu stie cine e querySelectorAll.

Nu stiu de ce si cum (poate am sters din greseala, tot modificand) nu mai aveam biblioteca jquery. Si astfel nu mai 'stia' de $()). Am adaugat-o din nou si, in cele din urma, functioneaza! :)

Multumesc pentru sfat. Rezolvat. Se poate inchide.

Subiecte similare