Insertion d'un enregistrement de base de données à partir d'un formulaire HTML avec jQuery + AJAX - php, jquery, ajax, formulaires

L’insertion d’un enregistrement de base de données à partir d’un formulaire HTML avec jQuery + AJAX est ce que j’essaie de faire, mais cela ne semble pas fonctionner pour moi.

Le HTML ressemble à ceci:

        <form method="post" id="message-form">
<textarea id="new-message" name="message" placeholder="Nieuw bericht"></textarea>
<input type="hidden" id="message-sender" name="sender" value="<?=$_SESSION["user_id"]?>">
<input type="hidden" id="message-recipient" name="recipient" value="<?=$aConversationPartner["id"]?>">
<input type="submit" name="submit-message" id="send-message" value="Verstuur bericht">
</form>

Le code jQuery ressemble à ceci:

       $("#send-message").click(function (e) {
e.preventDefault();
if($("#new-message").val()==="")
{
alert("Uw bericht is leeg!");
return false;
}

var myData = "message="+ $("#new-message").val() + "&sender=" + $("#message-sender").val() + "&recipient=" + $("#message-recipient").val(); //build a post data structure
jQuery.ajax({
type: "POST",
url: "sendmessage.php",
dataType:"text",
data:myData,
success:function(response){

console.log("great succes");

}
});
});

sendmessage.php ressemble à ceci:

<?

require_once("config.php");
require_once("lib.php");

sendMessage($_POST["sender"], $_POST["recipient"], $_POST["message"], 1);

?>

La fonction sendMessage php fonctionne parfaitement si je l’utilise sans AJAX, ce qui ne poserait donc pas de problème. Ce qui est très étrange, c’est que je n’obtiens aucune erreur de console, et console.log("great succes"); est viré. Je suis nouveau sur jQuery + AJAX et cherche désespérément une réponse. Merci de me donner une réponse que je peux comprendre et mettre en oeuvre.

Réponses:

1 pour la réponse № 1

Vous devez placer vos données dans un objet JavaScript.

remplacer

var myData = "message="+ $("#new-message").val() + "&sender=" + $("#message-sender").val() + "&recipient=" + $("#message-recipient").val();

par

var myData = {
message: $("#new-message").val(),
sender: $("#message-sender").val(),
recipient: $("#message-recipient").val()
};

---

1 pour la réponse № 2

"Vous n'échappez pas aux valeurs de votre chaîne de requête. Il existe deux façons simples de procéder avec jQuery:

1. Utilisation var myData = $("#message-form").serialize(); puisque vous envoyez toutes les valeurs du formulaire.

2. Placez les paramètres dans un objet:

   var myData = {
   message: $("#new-message").val(),
   sender: $("#message-sender").val(),
   recipient: $("#message-recipient").val()
   };
   

La manière simple de Javascript est d'appeler encodeURIComponent:

var myData = "message="+ encodeURIComponent($("#new-message").val()) +
"&sender=" + encodeURIComponent($("#message-sender").val()) +
"&recipient=" + encodeURIComponent($("#message-recipient").val());

---