Bonjours, bonsoirs
J'ai realiser un chat en php ajax ... tout fonctionne à la perfection, sauf que mon formulaire s’exécute, malgrès mon code qui l'empeche de le faire je ne sais pas pourquoi ca ne fonctionne pas .
Se que je veut dire par << l'empeche >> , c'est d'empecher la redirection vers la page et evite un refresh de page.
Code ajax :
je vous partage uniquement la function qui permet d'ajouter un message.
function postMessage(event){
event.preventDefault();
const author = document.querySelector('#author');
const content = document.querySelector('#content');
const data = new FormData();
data.append('author', author.value);
data.append('content', content.value);
const requeteAjax = new XMLHttpRequest();
requeteAjax.open('POST', '../../../../html/ltr/coqpix/php/chat_crea.php?task=write');
requeteAjax.onload = function(){
content.value = '';
content.focus();
getMessages();
}
requeteAjax.send(data);
}
le code php qui s'execute
function postMessage(){
global $bdd;
if(!array_key_exists('author', $_POST) || !array_key_exists('content', $_POST)){
echo json_encode(["status" => "error", "message" => "One field or many not been sent"]);
return;
}
$destination = "coqpix".$_POST['author']."";
$date_crea = date("d-m-Y");
$date_h = date("H") + "1";
if($date_h == "24"){
$date_h = "00";
}
$date_m = date("i");
$content = $_POST['content'];
$query = $bdd->prepare('INSERT INTO chat_crea (destination, date_crea, date_h, date_m, message_crea) VALUES(?,?,?,?,?)');
$query->execute(array(
htmlspecialchars($destination),
htmlspecialchars($date_crea),
htmlspecialchars($date_h),
htmlspecialchars($date_m),
htmlspecialchars($content)
));
echo json_encode(["status" => "sucess"]);
}
code html ...
<div class="card-body widget-chat-container widget-chat-demo-scroll">
<div class="chat-content" id="chat-content">
<!-- contenue renvoyé -->
</div>
</div>
<div class="card-footer border-top p-1">
<form class="d-flex" action="php/chat_crea.php?task=write" method="POST">
<input type="hidden" name="author" id="author" value="<?= $crea['name_crea'] ?>">
<input type="text" name="content" id="content" class="form-control chat-message-demo mr-75" placeholder="Tappez votre message...">
<button type="submit" class="btn btn-primary glow px-1"><i class="bx bx-paper-plane"></i></button>
</form>
</div>
</div>
la ligne qui est sencé empecher l'action de redirection vers la page php est :
event.preventDefault();
si je me trompe pas.
- Messages postés
-
44
- Date d'inscription
- lundi 30 décembre 2019
- Statut
- Membre
- Dernière intervention
- 4 janvier 2021
3 > jordane45pour illustrer se que je veut dire j'ai fait une petite video ... je ne sais pas si c'est autoriser mais voila.
https://www.youtube.com/watch?v=akg0dhyeJ7I
- Messages postés
-
30910
- Date d'inscription
- mercredi 22 octobre 2003
- Statut
- Modérateur
- Dernière intervention
- 8 janvier 2021
3 157 > ScreamFRRetire les attributs action et method et le souci sera résolu
- Messages postés
-
44
- Date d'inscription
- lundi 30 décembre 2019
- Statut
- Membre
- Dernière intervention
- 4 janvier 2021
3 > jordane45J'ai essaye de faire une condition pour faire un petit truc simpas qui consiste a que quand le message vien de moi il s'affiche à droite et quand il vient d'une autre personne il s'affiche à gauche.
Dans mon css c'est la class "chat-fleft" qui fait cela mais je ne sais pas comment faire ppour introduire cela dans mon code js ?
J"ai tenté un petit truc :
requeteAjax.onload = function(){ const resultat = JSON.parse(requeteAjax.responseText); const html = resultat.reverse().map(function(message){ if(${message.you} == "coqpix"){ var droite = ''; }else{ var droite = 'chat-left', } return `<div class="chat droite"> <div class="chat-body"> <div class="chat-message"> <p>${message.message_crea}</p> <span class="chat-time">${message.date_h}:${message.date_m}</span> </div> </div> </div>` }).join('');j'ai mit une condition if pour que quand la colonne de la bdd you !== a coqpix , il y mettent la class css
Je pense que cela vient d'un problème d'inscrementation ?
- Messages postés
-
30910
- Date d'inscription
- mercredi 22 octobre 2003
- Statut
- Modérateur
- Dernière intervention
- 8 janvier 2021
3 157 > ScreamFREn plus, réouvrir une discussion qui avait été mise comme traitée ce n'est pas la meilleure idée qu'on puisse avoir au risque que personne ne la remarque...
Donc, merci de remettre le sujet en résolu et de créer une nouvelle discussion propre à ce nouveau souci.
- Messages postés
-
44
- Date d'inscription
- lundi 30 décembre 2019
- Statut
- Membre
- Dernière intervention
- 4 janvier 2021
3 > jordane45