[AJAX] Mise à jour sur textarea

**ciolvic** · 10/12/2014, 15h06

Je rencontre un pbl pour la mise à jour d'un textarea dans mon formulaire.
Explication:
mon formulaire comprends deux select l'un mis à jour par l'intermédiaire de l'autre ainsi qu'un textarea mise à jour par l'un des deux.

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<form statut="create_ticket.php?dise_id=<?php echo $dise_id ?>" method="POST" > 
	<fieldset style="width:565px;height:655px;">
		<legend>Ouverture ticket</legend>
		<label>Numero joignable</label>
		+33<input type="text" placeholder="msisdn" maxlength="9" name="msisdn" size="9" ></br>
		<label>Categorie</label>
		<select name='categorie' id='categorie' onchange='set_ss_cat()'>
			<option value='0'>Aucun</option>
			<?
                        $res = $db_intranet->Execute("
                                        SELECT Titre, Id_ticket_categorie FROM ticket_categorie ORDER BY id_ticket_categorie ASC
                                ",
                                array ()
                        );
                        //
                        $statut = $res->fetchAll(PDO::FETCH_NUM);
                        //
                        foreach($statut as $cat){
                                echo "<option value='".$cat[1]."'>".$cat[0]."</option>"; 
                        }
                        ?>
		</select>
		<br>
		<label>Sous-categorie</label>
			<select name='ss-cat' id='ss-cat' onchange='message_test()'>
				<option value='0'>Sous categorie</option>
			</select>
		<br>
		<label>Message :</label>
		<br>	
		<textarea id='message' name="message" rows="29" cols="70"></textarea>
		<input type="submit" value="Valider">
	</fieldset>
 
</form>

Au niveau du mécanisme de mise à jour je passe par des requêtes AJAX.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
var explode = new Array("","1","6","12","23","26","30","33","35","37","42","46");
function set_ss_cat(){
	var xhr = getXhr();
	var message_t = getXhr();
	// On défini ce qu'on va faire quand on aura la réponse
	xhr.onreadystatechange = function(){
		// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
		if(xhr.readyState == 4 && xhr.status == 200){
			di = document.getElementById('ss-cat');
			di.innerHTML = xhr.responseText;
		}
	}
	// alert(explode[1]);
	// Ici on va voir comment faire du post
	xhr.open("POST","sscat.php",true);
	// ne pas oublier ça pour le post
	xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
	// ne pas oublier de poster les arguments
	// ici, l'id de l'auteur
	categorie = document.getElementById('categorie').options[document.getElementById('categorie').selectedIndex].value;
	// alert(categorie);
	xhr.send("categorie="+categorie);
 
	message_t.onreadystatechange = function(){
		//alert(xhr.readyState); 
		// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
		if(message_t.readyState == 4 && message_t.status == 200){
			mes = document.getElementById('message');
			mes.innerHTML = message_t.responseText;
		}
	}
	// Ici on va voir comment faire du post
	message_t.open("POST","message_text.php",true);
	// ne pas oublier ça pour le post
	message_t.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
	// ne pas oublier de poster les arguments
	// ici, l'id de l'auteur
	categorie = document.getElementById('categorie').options[document.getElementById('categorie').selectedIndex].value;
	//
	message_t.send("ss_cat="+explode[categorie]);
}