Traiter les données d'un formulaire

Signaler
Messages postés
20
Date d'inscription
vendredi 11 novembre 2011
Statut
Membre
Dernière intervention
6 juin 2012
-
Messages postés
20
Date d'inscription
vendredi 11 novembre 2011
Statut
Membre
Dernière intervention
6 juin 2012
-
Bonjour à tous !

Je vous expose mon petit soucis : j'aimerais faire un formulaire où l'utilisateur pourrait rajouter, via un champ, l'url d'un site web (le nom du site est pour l'instant prédéfini, mais mon objectif sera de donner la possibilité à l'utilisateur de le rentrer dans un champ, afin qu'il corresponde bien au site en question).
J'arrive à rajouter des liens via du javaScript (DOM), mais via un formulaire, c'est une autre paire de manche...

Pour l'instant, j'ai ceci :

FORMULAIRE :
<form action="admin.js" method="POST" id="formulaire" name="formulaire">
            
           <label for="">lien à rajouter (url) : </label>, ,
----
<label for="">nom du lien : </label>, ,
----

    
</form>


FEUILLET JS POUR LE TRAITEMENT DES DONNEES
if (document.formulaire.url.value != "")
{
 // création des éléments 
 var lien = document.createElement('a'); //création de l'élément 
 var lienTexte = document.createTextNode("nom_du_site"); //création du noeud textuel
 
 //affectation des attributs
 lien.id = 'lien_site'; //affectation de l'id
 lien.href = document.formulaire.url.value; //affectation de href (lien)

 // insertion des éléments les uns dans les autres
 lien.appendChild(lienTexte); //insertion du texte sur le lien
 //document.getElementById('SG').appendChild(lien);  //insertion de l'élément  dans l'élément  portant l'id ''

var ul= document.getElementById('SG');
ul.appendChild(lien);	

}


Mais rien ne se passe, le lien n'est pas rajouté à l'endroit où je souhaite...des indices ?

3 réponses

Messages postés
72
Date d'inscription
mercredi 7 février 2007
Statut
Membre
Dernière intervention
25 juillet 2013
1
Bonjour,
Chez moi, ca fonctionne :

<html>
<head>
<script>
var addUrl=function() {
    if (document.formulaire.url.value.length>0) {
        var nomLien=document.formulaire.nom_lien.value;
        //Si le nom du lien est vide, on met "nom du site"
        if(nomLien.length==0) {
            nomLien="Nom du site";
        }
        // création des éléments 
        var lien = document.createElement('a'); //création de l'élément 
        var lienTexte = document.createTextNode(nomLien); //création du noeud textuel
        //affectation des attributs
        lien.id = 'lien_site'; //affectation de l'id
        lien.href = document.formulaire.url.value; //affectation de href (lien)
        // insertion des éléments les uns dans les autres
        lien.appendChild(lienTexte); //insertion du texte sur le lien
        //document.getElementById('SG').appendChild(lien);  //insertion de l'élément  dans l'élément  portant l'id ''

        var ul= document.getElementById('SG');
        ul.appendChild(lien);	
        return false;
    }
    else {
        return false;
    }
}
</script>
</head>

<form action="test.html" onsubmit="return(addUrl())" method="POST" id="formulaire" name="formulaire">
            
           <label for="">lien à rajouter (url) : </label>, ,
----
<label for="">nom du lien : </label>, ,
----

    
</form>


</html>




---------------------
Oderint dum metuant
Messages postés
20
Date d'inscription
vendredi 11 novembre 2011
Statut
Membre
Dernière intervention
6 juin 2012

Merci de t'être penché dessus pmcoste, il me manquait le "onsubmit" qui fait appel à la fonction anonyme placée dans la variable "addUrl". Du coup ça fonctionne aussi de mon côté lorsque je place le tout sur une page, mais pas encore quand je dois faire insérer les données dans une autre page. Je travaille dessus; merci encore !
Messages postés
20
Date d'inscription
vendredi 11 novembre 2011
Statut
Membre
Dernière intervention
6 juin 2012

J'ai fait une recherche afin de faire en sorte de lier ma page contenant le formulaire + le code JS, et la page html où doivent s'effectuer les modifications indiquées par le code JS.
Juste avant dans la page html, j'insère un lien afin que la page ait accès au code JS, comme ceci : <script src="page.js"></script>, mais...rien ne se passe. J'ai lu qu'il y avait une autre méthode, qui est d'insérer directement le code JS dans la page en question, mais je voudrais faire en sorte de pouvoir appeller la page du code à partir de la page html à modifier.
Y-a-t-il une méthode alternative ?