modification d'une zone de texte sur appui bouton

Flodigarry · Message par **Flodigarry** » 07 mars 2005, 18:39

Bonjour,
apres de longues recherches sur le net je m'en remets à vous car le javascript me desepere!!!

C'est tout simple, j'aimerai que lors d'un clic sur un lien ou sur un bouton, le texte incrit dans une zone de texte soit modifié.
Pourquoi ceci ne fonctionne-t-il pas :

<a href="#cadre_reception" onclick="document.id_de_la_zone.value="nouveau_texte"">
... </a>

<input type="text" id="id_de_la_zone">

J'ai eu l'impression de tout essayer (.value.texte, etc...)!!
Merci d'avance pour votre aide et pour ce forum!
A+

JujuLand · Message par **JujuLand** » 07 mars 2005, 18:48

il me semble que OnClick devrait appeler une fonction javascript située dans le header, et qui fixerait le nouveau nom.

mais pas directement dans les parametres de ton texte, là, tu fais du html, non du javascript

Flodigarry · Message par **Flodigarry** » 07 mars 2005, 18:55

euhh... peut-être mais ca ne peut pas marcher comme ca?
Et si je mets une fonction javascript ds le header que j'appelle apres avec onclick, je mets quoi dans la fonction exactement?
Merci de ton aide en tous cas

calimo · Message par **calimo** » 07 mars 2005, 19:01

Flodigarry a écrit :Bonjour,

Salut !

Flodigarry a écrit :apres de longues recherches sur le net je m'en remets à vous car le javascript me desepere!!!
C'est tout simple, j'aimerai que lors d'un clic sur un lien ou sur un bouton, le texte incrit dans une zone de texte soit modifié.
Pourquoi ceci ne fonctionne-t-il pas :

Premier conseil, la console javascript ! Elle est disponibe via la menu "Outils" > "Console Javascript".

Elle affiche les erreurs javascript de tes scripts, ce qui est bien utile dans ce genre de cas quand ça ne marche pas (et aussi pour vérifier qu'il n'y a pas d'erreurs quand ça marche).

Flodigarry a écrit :<a href="#cadre_reception" onclick="document.id_de_la_zone.value="nouveau_texte"">
... </a>

document.id ça n'existe pas, par contre tu peux faire un document.getElementById("id_que_tu_veux").

Ensuite ce n'est surement pas .value, mais plutôt .appendChild(document.createTextNode('texte))

Flodigarry · Message par **Flodigarry** » 07 mars 2005, 19:18

Merci de m'avoir repondu mais la c pire que tout

Je ne comprends pas ton code, dois-je définir qqch ds le header?
J'ai essayé mais ca ne fonctionne tjs pas!

<body style="direction: ltr;">blabla<br>
<br>

<a href="#cadre_reception" onclick="document.getElementById("id_aaa").appendChild(document.createTextNode('texte))="essai"">
<img style="border: 0px solid ; width: 70px; height: 46px;" alt="" src="qqch.jpg">
</a><br>

<input type="text" id="id_aaa">
</div>

<img style="width: 700px; height: 479px;" id="cadre_reception" name="imagine" alt="" src="ktf.gif"><br>

</body></html>

calimo · Message par **calimo** » 07 mars 2005, 19:19

Tu as regardé ta console javascript comme je t'ai dit ?

Flodigarry · Message par **Flodigarry** » 07 mars 2005, 19:23

oui,
j'ai tout effacé pour ne garder que les nouveaux messages d'erreurs, et maintent je réouvre mon fichier, je peux même le visualiser avec le navigateur et apres quand j'ouvre la console javascript il n'y a rien.
Il y un truc à faire de spécial pour voir les erreurs?

calimo · Message par **calimo** » 07 mars 2005, 19:39

Ah ben si, en cliquant sur le lien tu as une magnifique erreur !

Code : Tout sélectionner

onclick="document.getElementById("id_aaa")..."

Tes attributs sont mis entre guillemets doubles : "..." Si tu rajoutes d'autres guillets double dedans, tu fermes ces attributs. Il faut donc utiliser des guillemets simples dans ton javascript.

Code : Tout sélectionner

createTextNode('texte)

Tu n'as pas fermé le guillemet. Ça ne peut pas marcher.
En plus il ne faut pas mettre de ="essai", le texte il est créé dans le createTextNode, je t'accorde que pour être plus clair j'aurais pu mettre.

Le javascript ce n'est pas du HTML, tu ne peux pas faire n'importe quoi n'importe comment, il faut respecter la syntaxe et être un minimum attentif.

Je t'accorde qu'ayant tappé rapidement le code il n'était pas irréprochable, et que j'aurais pu être plus clair en tappant

Code : Tout sélectionner

.appendChild(document.createTextNode('ici le texte qui doit apparaître'))

Au final un truc de ce genre devrait plus ou moins fonctionner :

Code : Tout sélectionner

document.getElementById('id_aaa').appendChild(document.createTextNode('texte'))

Flodigarry · Message par **Flodigarry** » 07 mars 2005, 19:49

MERCIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIII

Lol, ca marche.
Merci d'avoir un peu de ton temps pour aider un pauvre débutant.
Bye a+

Flodigarry · Message par **Flodigarry** » 07 mars 2005, 20:12

je me permets une derniere petite question :
ceci fonctionne mais ayant plusieurs boutons qui vont ecrire dans la même zone, comment faire pour que le texte soit remplacé et non écrit par dessus comme actuellement?

merci

Flodigarry · Message par **Flodigarry** » 21 mars 2005, 15:49

Re,
Toujours le même problème que je n'arrive pas à résoudre (pour rappel, c'est modifier le contenu d'une zone de texte avec des liens).
La solution de Calimo ne me convient pas car elle écrit le nouveau texte à la suite de l'ancien au lieu de le remplacer).
Alors j'utilise celle-ci :

- Déclaration d'une zone de texte dans un formulaire :
<form name="changer">
<textarea style="float: left; position: absolute; top: 30%; font-family: Courier New; font-weight: bold; color: rgb(0, 0, 0); text-align: justify; background-color: rgb(211, 211, 211); width: 88%; left: 3.5%;" name="zonetexte">blabla</textarea>
</form>

- Modif du texte via la fonction suivante :
<a href="#cadre_reception" onclick="document.forms['changer'].elements['zonetexte'].value = 'test' ">

Ceci fonctionne au détail pres que je n'arrive pas à insérer des sauts de ligne <br> dans le champ "value".

Quelqu'un aurait-il la solution?
Merci

PsyDk · Message par **PsyDk** » 21 mars 2005, 18:19

Tu peux utiliser « \n » pour indiquer un saut de ligne dans le contenu du textarea.

Attention aussi à toujours retourner « false » dans le onclick pour ne pas déclencher l'ouverture du lien défini par href.

Voici une page d'illustration :

Code : Tout sélectionner

<?xml version="1.0" encoding="iso-8859-15"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<title>Title</title>

<script type="text/javascript">
function ChangeText()
{
	var monTextArea = document.getElementById("plop");
	monTextArea.value = "coucou\nles gens";
}
</script>

</head>
<body>

<form><textarea id="plop">blabla</textarea></form>

<p><a href="#cadre_reception" onclick="ChangeText(); return false;">clique-moi</a></p>

</body>
</html>

Flodigarry · Message par **Flodigarry** » 21 mars 2005, 18:58

Nikel, ca marche!
Pour le lien c bon.
Je te remercie

Geckozone

modification d'une zone de texte sur appui bouton

modification d'une zone de texte sur appui bouton

Re: modification d'une zone de texte sur appui bouton

Qui est en ligne ?