Discussion :

[spawns]

Bonjour à tous,
je suis un newbie en ajax, et j'essaie de vérifier qu'un textarea sous tinymce est vide.
Mais visiblement cela ne fonctionne pas comme un input classique.
qu'il soit vide au rempli cela m'indique toujours mon message erreur "Veuillez saisir une description".

voici mon code :
le form html

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
<form  id="envoifacture" >
...
<div class="col-12">
<label for="description" class="form-label"><h6>Description <span class="text-danger"> * </span></h6></label>
<textarea class="form-control form_facture" placeholder="description" name="description" id="description" rows="10"></textarea>
<span id="description_error" class="badge bg-danger"></span>
</div>
...
</form>
	<script src="ajaxajoutfac.js"></script>
    <script src="tinymce/tinymce.min.js"></script>
    <script src="tinymce/plugins/code/plugin.min.js"></script>
    <script>
        tinymce.init({selector: "textarea",language : 'fr_FR',toolbar: 'undo redo | styleselect | bold italic underline | link | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | forecolor image code', plugins: 'link image code paste lists'});
    </script>

ajaxajoutfac.js

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
42
43
44
45
46
function save_facture()
{
	var form_element = document.getElementsByClassName('form_facture');
	var form_facture = new FormData();
	for(var count = 0; count < form_element.length; count++)
	{
		form_facture.append(form_element[count].name, form_element[count].value);
	}
 
	document.getElementById('submit').disabled = true;
 
	var ajax_request = new XMLHttpRequest();
	ajax_request.open('POST', 'processajoutfac.php');
	ajax_request.send(form_facture);
	ajax_request.onreadystatechange = function()
	{
		if(ajax_request.readyState == 4 && ajax_request.status == 200)
		{
			document.getElementById('submit').disabled = false;
			var response = JSON.parse(ajax_request.responseText);
			if(response.success != '')
			{
				document.getElementById('envoifacture').reset();
				document.getElementById('message').innerHTML = response.success;
				setTimeout(function(){
					document.getElementById('message').innerHTML = '';
				}, 5000);
 
				document.getElementById('societe_error').innerHTML = '';
				document.getElementById('nmr_error').innerHTML = '';
 
				document.getElementById('description_error').innerHTML = '';
 
			}
			else
			{
				//display validation error
				document.getElementById('societe_error').innerHTML = response.societe_error;
				document.getElementById('nmr_error').innerHTML = response.nmr_error;
				document.getElementById('description_error').innerHTML = response.description_error;
			}
 
 
		}
	}
}

processajoutfac.php

Code php :

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

1
2
3
4
5
6
7
...
$description = mysqli_real_escape_string($mysqli, htmlspecialchars(stripslashes(ucfirst($_POST["description"]))));
$description_error = '';
	if(empty($description))
	{
		$description_error = '<i class="bi bi-x-circle align-top"></i> Veuillez saisir une description';
	}.....

Comment faire,
Merci d'avance de votre aide
Cdt

[Toufik83]

Bonjour,

Ce n'est pas comme ça qu'on récupère la valeur de tinymce, Il faut utiliser la méthode getContent() de l'API...

[spawns]

Ok,
j'ai un peu de mal...
peux tu m'aider pour l'intégrer dans mon code ?

Merci

[Toufik83]

Bonjour,

Il suffit de vérifier le name lors de l'ajout des variables :

Code :

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

1
2
3
4
5
6
7
 
for(var count = 0; count < form_element.length; count++){
	form_facture.append(form_element[count].name, 
         form_element[count].name=="description"
           ?tinymce.get('description').getContent()
           :form_element[count].value);
}

[NoSmoking]

Bonjour,

je suis un newbie en ajax, et j'essaie de vérifier qu'un textarea sous tinymce est vide.
Mais visiblement cela ne fonctionne pas comme un input classique.

il me semble me rappeler que TinyMCE ne remplit les <textarea> que lors de la soumission des formulaires.

Toufik83 t'a apporté la solution et je précise que l'on peut préremplir les FormData en passant en paramétre la référence au formulaire traité

Code :

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

1
2
3
4
5
var form_element = document.getElementsByClassName('form_facture');
var form_facture = new FormData(form_element);
// ici tout n'y est pas il manque le contenu TEXTAREA
// donc on le remplace avec FormData.set 
form_facture.set("description", tinymce.get("description").getContent());

Attention FormData.set() et pas FormData.append()

[spawns]

Merci les gars c'est nickel
comme d'hab.
@+