Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
2905 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [resolu] [Javascript] Afficher un DIV onclick

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

[resolu] [Javascript] Afficher un DIV onclick

n°794130
houam3012
Au pays des chauve souris
Posté le 13-07-2004 à 00:47:53  profilanswer
 

Voila je souhaite construire une page php permettant l'enregistrement d'un itineraire dans une base.
Par defaut la page offre un DIV qui permet a l'utilisateur d'ecrire le numero de la journee dans un input, puis une description dans un autre input.
Je souhaiterai qu'un cliquant sur un lien ou un bouton je sais pas, un autre DIV identique apparraisse, avec des identifiants differents pour les input, afin de permettre a l'utilisateur de rentrer des infos pour un autre jour. Et ce autant de fois qu'il le desire. Je me suis dit que javascript pourrait me faire ca mais je suis absolute beginneret je ne sais pas par ou commencer.
Comment puis-je faire?
Merci


Message édité par houam3012 le 14-07-2004 à 11:18:57

---------------
"Étudiez comme si vous deviez vivre toujours; vivez comme si vous deviez mourir demain"
mood
Publicité
Posté le 13-07-2004 à 00:47:53  profilanswer
 

n°794132
gm_superst​ar
Appelez-moi Super
Posté le 13-07-2004 à 00:57:47  profilanswer
 

Faut utiliser les méthodes DOM pour ajouter des éléments, des attributs... voir appendChild() document.createElement() setAttribute()
 
Sinon tu peux y aller plus direct en utilisant innerHTML pour ajouter d'un coup l'ensemble DIV + formulaire


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
n°794170
houam3012
Au pays des chauve souris
Posté le 13-07-2004 à 05:42:37  profilanswer
 

Effectivement gm_superstar la solution se trouve bien dans l'utilisation des methodes DOM
Merci!  :jap:  
 
Voici mon code pour le moment:

Code :
  1. var numDay=2;
  2.   function addDay()
  3.   {
  4.    var theDay=document.getElementById('days');
  5.    var theName='day'+numDay;
  6.    var theNameDesc='dayDesc'+numDay;
  7.    var theDiv = document.createElement('DIV') ;
  8.        theDay.appendChild(theDiv) ;
  9.        theDiv.className = 'main';
  10.  
  11.        var theDivSpac = document.createElement('DIV') ;
  12.        theDiv.appendChild(theDivSpac) ;
  13.        theDivSpac.className = 'spacer';
  14.  
  15.        var theDivRow = document.createElement('DIV') ;
  16.        theDiv.appendChild(theDivRow) ;
  17.        theDivRow.className = 'row';
  18.  
  19.        var theSpanLabel = document.createElement('span') ;
  20.        theDivRow.appendChild(theSpanLabel) ;
  21.        theSpanLabel.appendChild(document.createTextNode('Number of the day :'));
  22.        theSpanLabel.className = 'label';
  23.  
  24.        var theSpanFormw = document.createElement('span') ;
  25.        theDivRow.appendChild(theSpanFormw) ;
  26.        theSpanFormw.className = 'formw';
  27.  
  28.        var InpNumDay = document.createElement('INPUT') ;
  29.        theSpanFormw.appendChild(InpNumDay) ;
  30.        InpNumDay.setAttribute('type','text') ;
  31.        InpNumDay.setAttribute('size','2') ;
  32.        InpNumDay.setAttribute('value',numDay);
  33.        InpNumDay.setAttribute('name',theName);
  34.        InpNumDay.setAttribute('id',theName);
  35.  
  36.        var theDivRow2 = document.createElement('DIV') ;
  37.        theDiv.appendChild(theDivRow2) ;
  38.        theDivRow2.className = 'row';
  39.  
  40.        var theSpanLabel2 = document.createElement('span') ;
  41.        theDivRow2.appendChild(theSpanLabel2) ;
  42.        theSpanLabel2.appendChild(document.createTextNode('Description of the day :'));
  43.        theSpanLabel2.className = 'label';
  44.  
  45.        var theSpanFormw2 = document.createElement('span') ;
  46.        theDivRow2.appendChild(theSpanFormw2) ;
  47.        theSpanFormw2.className = 'formw';
  48.  
  49.        var AreaDayDesc = document.createElement('TEXTAREA') ;
  50.        theSpanFormw2.appendChild(AreaDayDesc) ;
  51.        AreaDayDesc.setAttribute('cols','50') ;
  52.        AreaDayDesc.setAttribute('rows','8') ;
  53.        AreaDayDesc.setAttribute('name',theNameDesc);
  54.        AreaDayDesc.setAttribute('id',theNameDesc);
  55.  
  56.        var theDivSpac2 = document.createElement('DIV') ;
  57.        theDiv.appendChild(theDivSpac2) ;
  58.        theDivSpac2.className = 'spacer';
  59.        var Separator = document.createElement('HR') ;
  60.        theDiv.appendChild(Separator) ;
  61.        Separator.className = 'separator';
  62.  
  63.        numDay+=1;
  64.       }


 
Bon ca m'a pas l'air trop crado, si?
 
Maintenant que j'ai tous mes input et textarea j'aurai souhaite recuperer leur valeur respective, afin de les enregistrer dans ma base de donnees. J'ai vu qu'en utilisant:
 

Code :
  1. tabInput=document.getElementById('theBody').getElementByTagName('INPUT');
  2. tabArea=document.getElementById('theBody').getElementByTagName('TEXTAREA');


 
j'obtenais deux tableaux contenant les differentes valeurs de mes input et textarea de mon body. Mais comment puis-je faire le lien avec PHP pour lui dire de recuperer ses valeurs dans un tableau javascript?
 
voila, merci.


---------------
"Étudiez comme si vous deviez vivre toujours; vivez comme si vous deviez mourir demain"
n°794285
fxoxo
Posté le 13-07-2004 à 10:01:41  profilanswer
 

Je ne crois pas que tu peux faire le liens entre un tableau javascript et PHP ( mais je me trompe peu être ??? ) car javascript est executé coté client et php coté serveur.
 
Pour récupérer tes valeurs essai plutot :
Tu incrémente une variable $i  
dans ton formulaire tu nomme les champs "machin_$i"
ex: <input name="nom_$i" ..>
 
Dans la page ou est posté ton formulaire tu récupére tes variables dans une boucle (de 0 à $i) à l'aide de la fonction php eval()  
 
 
 
 
 
 
 
 
 

n°795175
gm_superst​ar
Appelez-moi Super
Posté le 13-07-2004 à 19:15:10  profilanswer
 

houam3012 a écrit :

Bon ca m'a pas l'air trop crado, si?


Ca m'a l'air pas mal. Mais j'ajouterais le DIV conteneur à la fin. Ca devrait être plus rapide.

houam3012 a écrit :


Maintenant que j'ai tous mes input et textarea j'aurai souhaite recuperer leur valeur respective, afin de les enregistrer dans ma base de donnees. J'ai vu qu'en utilisant:
 

Code :
  1. tabInput=document.getElementById('theBody').getElementByTagName('INPUT');
  2. tabArea=document.getElementById('theBody').getElementByTagName('TEXTAREA');


 
j'obtenais deux tableaux contenant les differentes valeurs de mes input et textarea de mon body. Mais comment puis-je faire le lien avec PHP pour lui dire de recuperer ses valeurs dans un tableau javascript?
 
voila, merci.


Ben tu te compliques la vie pour rien... Soumets ton formulaire à un script PHP et c'est bon.


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
n°795372
houam3012
Au pays des chauve souris
Posté le 14-07-2004 à 03:16:21  profilanswer
 

Merci a tous les deux!!
 
Dis-moi gm_superstar, qu'entends-tu par mettre mon div conteneur a la fin?
 
Pour les tableaux, effectivement je me fais chier pour rien, d'autant qu'une fois que l'utilisateur a remplit les champs il n'a d'autre solution que de soumettre le formulaire. Reste a trouver le moyen de savoir combien d'input ont ete crees mais je pense qu'une variable php incrementee par le javascript devrait faire l'affaire!


---------------
"Étudiez comme si vous deviez vivre toujours; vivez comme si vous deviez mourir demain"
n°795445
gm_superst​ar
Appelez-moi Super
Posté le 14-07-2004 à 10:19:49  profilanswer
 

houam3012 a écrit :

Dis-moi gm_superstar, qu'entends-tu par mettre mon div conteneur a la fin?


Ben mettre
 
theDay.appendChild(theDiv);
 
 
à la fin, une fois theDiv bien rempli


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
n°795517
houam3012
Au pays des chauve souris
Posté le 14-07-2004 à 11:18:01  profilanswer
 

Ah yep!
 
Merci, une petite balise resolu pour mon sujet :)


---------------
"Étudiez comme si vous deviez vivre toujours; vivez comme si vous deviez mourir demain"

Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [resolu] [Javascript] Afficher un DIV onclick

 

Sujets relatifs
recuperer variable d'URL en JavaScriptrécuperer dans du php une valeur envoyé par du javascript
perl + regex [resolu][Python] TypeError sur une concaténation de chaines [Résolu]
Interdire des requêtes dans un input...[RESOLU]Page d'attente pour moteur de recherche [résolu]
[Résolu] [Regex] reconnaitre une chaîne non complète - java[javascript]remplacer antislash par slash
[RESOLU] [javascript] superposition d'images 
Plus de sujets relatifs à : [resolu] [Javascript] Afficher un DIV onclick


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR