Mise en forme de texte dans un formulaire HTML

Mise en forme de texte dans un formulaire HTML - HTML/CSS - Programmation

Marsh Posté le 20-07-2007 à 18:01:38    

Salut,
 
J'essaye de permettre a l utilisateur de personaliser son texte dans un formulaire qui est a la base en HTML.
D'apres ce que j'ai compris, il y a plusieurs facon de s'y prendre. PHP/Javascript... avec balises, ou alors comme un vrai editeur.
Le PHP je connais un peu mais le javascript pas du tout. Il me semble que c'est plus simple avec les boutons inserant des balises dans le formulaire, mais je ne sais pas comment faire le lien entre le bouton qui ne rechargera pas la page et l insertion de balises dans le formulaire avec placement du curseur entre les deux.
J'aimerais le faire moi-meme histoire d'apprendre donc
Pouvez-vous m expliquer les differences entre toutes les options et peut etre m'indiquer un bon tuto?
 
Merci

Reply

Marsh Posté le 20-07-2007 à 18:01:38   

Reply

Marsh Posté le 20-07-2007 à 22:28:34    

En essayant de jouer un peu avec javascript, que je ne connais pas du tout, je suis arrive au code suivant:
 

Code :
  1. function clicboutton(form_de_test, style)
  2. {
  3. var str = "<"+style+"></"+style+">";
  4. document.form_de_test.boite_de_texte.value="ca marche : "+str
  5. }


 

Code :
  1. <FORM NAME="form_de_test">
  2. <INPUT type=text size=30 name="titre" value="">
  3. <textarea cols="50" rows="10" name="boite_de_texte" ></textarea>
  4. <INPUT TYPE="button" NAME="bouton" VALUE="G" onClick="clicboutton(form_de_test, "b" )">
  5. <INPUT TYPE="button" NAME="bouton" VALUE="S" onClick="clicboutton(form_de_test, "u" )">
  6. <INPUT TYPE="button" NAME="bouton" VALUE="I" onClick="clicboutton(form_de_test, "i" )">
  7. <INPUT TYPE="button" NAME="bouton" VALUE="Centrer" onClick="clicboutton(form_de_test, "center" )">
  8. </FORM>


 
Cependant, je n'arrive a faire fonctionner ce code que si je ne passe pas l'argument "x" par l evenement onclick et que la fonction clicboutton ne prend qu'un argument comme ceci:

Code :
  1. function clicboutton(form_de_test)
  2. {
  3.         var style = "b";
  4. var str = "<"+style+"></"+style+">";
  5. document.form_de_test.boite_de_texte.value="ca marche : "+str
  6. }
  7. ...
  8. <INPUT TYPE="button" NAME="bouton" VALUE="G" onClick="clicboutton(form_de_test)">


 
Je n'arrive pas a comprendre pourquoi le code du dessus ne marche-t'il pas? Le onclick lie aux bouttons de formulaires est il limite a un seul argument?
 
Merci

Reply

Marsh Posté le 21-07-2007 à 12:38:01    

Javascript:
changer "clicboutton(form_de_test, "b" )" en "clicboutton(form_de_test, 'b' )"
Ce qui veut dire: appliquer la fonction clicboutton avec les variables form_de_test, 'b'  
 
Dans ton javascript tu récupère ces variables:
function clicboutton(form_de_test) donc ici tu ignore le deuxième
faudra mettre function clicboutton(var1,var2)
On peut en mettre autant qu'on veut...
 
Ensuite tu te bourre dans
var str = "<"+style+"></"+style+">";
document.form_de_test.boite_de_texte.value="ca marche : "+str
1. ce que tu mets revient à écrire ca marche: <B></B> donc ca ne fonctionne pas
2. dans textarea les balises html ne fonctionnent pas
 
Pour changer so mise en page il faut directement changer le style de textarea....

Code :
  1. <script>
  2.       function clicboutton(form_de_test,mef)
  3.           {
  4. var styl=mef //récuperer dans styl la valeur de mef
  5. var p =  document.form_de_test.boite_de_texte;
  6. switch (styl){
  7. case  "b": {p.style.fontWeight = "bold"; break}
  8. case  "u": {p.style.textDecoration = "underline"; break}
  9. case  "i": {p.style.fontStyle= "italic"; break}
  10. case "center" : {p.style.textAlign= "center"; break}
  11.   default:
  12.     //Instruction_par_défaut
  13.    break;
  14. }
  15. }
  16. </script>


Code :
  1. <br>      <FORM NAME="form_de_test">
  2. <br>          <INPUT type=text size=30 name="titre" value="">
  3. <br>          <textarea cols="50" rows="10" name="boite_de_texte" >Texte dans textarea</textarea>
  4. <br>          <INPUT TYPE="button" NAME="bouton" VALUE="G" onClick="clicboutton(form_de_test, 'b')">
  5. <br>          <INPUT TYPE="button" NAME="bouton" VALUE="S" onClick="clicboutton(form_de_test, 'u' )">
  6. <br>          <INPUT TYPE="button" NAME="bouton" VALUE="I" onClick="clicboutton(form_de_test, 'i' )">
  7. <br>          <INPUT TYPE="button" NAME="bouton" VALUE="Centrer" onClick="clicboutton(form_de_test, 'center' )">
  8.       </FORM>

Reply

Marsh Posté le 01-09-2007 à 15:29:41    

Salut tt le monde,
 
Par zazar, quelle serait la petite ligne de code pour réinitialiser ????
 
 :sarcastic:

Reply

Marsh Posté le 06-06-2011 à 13:47:57    

Et pour mettre en forme juste une partie (sélectionnée) dans le textarea ? C'est faisable ?


---------------
"Par moment j'me d'mande si chui pas con" G. de Suresnes
Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed