append et textarea

27 mars 2012, 05:39

Bonjour,

je voudrais saisir du texte sur un textarea et cliquer sur une image et recuperer son id, et l'ajouter au texte qui est deja saisi au textarea, mais ca marche pas:

<script>
$(document).ready(function(){
  
$("a.Icons").click(function () {
	
	var getID = $('img.Icons').attr('id');
	
  	$(".formatageCols").append(getID);
  
  });
  
  
  });
</script>


</head>

<body>

<form name="formatage" class="formatage">
<a style="cursor: pointer;" class="Icons" />
<img src="im_l.gif" class="Icons" id="im_l" />
</a>

<br />

<textarea cols="100" rows="20" dir="rtl" class="formatageCols"></textarea>

<input type="button" name="prev" class="prev" value="Preview" />

</form>

merci

27 mars 2012, 07:08

append() est fait pour rajouter des éléments au DOM, pas à un élément.
Regardes du côté de la fonction val() pour modifier un input ou un textarea.

27 mars 2012, 07:26

append() est fait pour rajouter des éléments au DOM, pas à un élément.
Regardes du côté de la fonction val() pour modifier un input ou un textarea.

ca marche avec val()

j'ai ajoute cette balise [bold], a l'effet de keyup je mets une previsualisation directe:

Code : Tout sélectionner

$(".formatageCols").keyup(function () {
  	$("#preview").html($('.formatageCols').val());
  });

comment puis je faire pour remplace [bold] par <b> et avoir une previsualisation correcte

27 mars 2012, 07:48

Regardes du côté de la méthode replace : http://www.toutjavascript.com/reference ... ef=replace
Et attention c'est un objet Regex correct qu'elle attend en entrée.
http://www.commentcamarche.net/contents ... egexp.php3

27 mars 2012, 14:10

voila le code:

Code : Tout sélectionner

var txt = $('.formatageCols').val();
	
	var showTxt = txt.replace('[bold]', '[b]');
	//var showTxt = txt.replace('[/bold]', '[/b]');

  	$("#preview").html(showTxt).val();

si je decommente la 2eme ligne, ca marche pas

de plus, comment faire pour selectionner un mot et cliquer sur Bold et ca devient:

[bold] mot [/bold]

27 mars 2012, 16:22

Lis mon dernier lien, tu ne l'as semble-t-il pas ouvert.

Pour l'action BBCode sur bouton tu trouveras bon nombre de méthode, d'exemples et de scripts tout fait en cherchant sur n'importe quel moteur de recherche.

28 mars 2012, 02:45

j'ai lu la doc, mais je voudrais avoir un truc genre PHP:

$bbcode = array('[b]', '[i]', '[u]');
$html = array('<b>', '<i>', '<u>');

code = str_replace($bbcode, $html, $textarea);

28 mars 2012, 04:48

j'ai essaye ca, mais ca marche pas:

Code : Tout sélectionner

var bbcodes = { 
  '[b]': '<b>', 
  '[/b]': '</b>', 
	};
	 
$.each(bbcodes, function(k, v) { 
  var showTxt = txt.replace(k, v);
  console.log(showTxt);
  $("#preview").html(showTxt);
});

28 mars 2012, 07:20

Je vais finir par abandonner... REGEX !
La fonction replace() prend en premier paramètre une regex !
Mon lien était pourtant on ne peut plus complet...

28 mars 2012, 07:36

Je vais finir par abandonner... REGEX !
La fonction replace() prend en premier paramètre une regex !
Mon lien était pourtant on ne peut plus complet...

j'ai lu la doc sur votre lien, et j'ai teste par un seule parametre:

Code : Tout sélectionner

  '[b]': '<b>'

alors je veux boucler pour prendre en consideration les autres:

Code : Tout sélectionner

'[/b]': '</b>',

c'est sur ce point j'ai pense a each, et mettre une var qui est le tableau, prendre k et remplacer par v

28 mars 2012, 07:48

un autre test:

Code : Tout sélectionner

var bbcode = ['[b]', '[/b]'];
var html = ['<b>', '</b>'];

var txt = $('.formatageCols').val();

	for (var i=0; i<20; i++) {
	field = txt.replace(new RegExp(bbcode[i], "g"), html[i]);
		}
	
	$("#preview").html(field);

28 mars 2012, 07:49

Les crochets [ ] définissent une liste de caractères autorisés (ou interdits).

Donc ta regex recherche le motif acceptant la lettre b. Pour rechercher :

Code : Tout sélectionner

\[b\]

Enfin vérifie que ta variable txt est globale (accessible dans la fonction $.each), car utiliser le mot clé var peut lui faire perdre cet attribut suivant là où tu la déclares il me semble.

28 mars 2012, 08:04

j'utilise pas each:

Code : Tout sélectionner

// j'ai change ici [b] par \[\b]
var bbcode = ['\[b\]', '[/b]', '[i]', '[/i]'];
var html = ['<b>', '</b>', '<i>', '</i>'];

var txt = $('.formatageCols').val();
console.log(txt);
			
			for (var i=0; i<20; i++) {
			var field = txt.replace(new RegExp(" "+(bbcode[i])+" ", "g"), html[i]);
			
		}
		
	$("#preview").html(field);

28 mars 2012, 11:39

Remplace field par txt, actuellement tu écrases sa valeur à chaque itération de la boucle.

Pourquoi rajouter des espaces dans la déclaration du regex ?

28 mars 2012, 13:07

en vain, elle les remplace pas:

Code : Tout sélectionner

var bbcode = ['\[b\]', '[/b]', '[i]', '[/i]'];
var html = ['<b>', '</b>', '<i>', '</i>'];

var txt = $('.formatageCols').val();
//console.log(txt);
	
	for (var i=0; i<20; i++) {
	var txt = txt.replace(new RegExp((bbcode[i]), "g"), html[i]);
	
		}
		
	$("#preview").html(txt);

append et textarea

Qui est en ligne