I have a form on my website that submits data using ajax, allowing for seamless interaction without page refresh.
After the form is submitted, I want to dynamically display the user's input by inserting it at the top of the content. However, I am unsure of how to retrieve and use the variables that were just posted.
In the form, there is an input field named "comment" where users can type their message:
var comment = $("#comment").val();
The next step is to send this input to a PHP script for database insertion:
$.ajax({
type: "POST",
url: "/pages/test/test_comments.php",
data: dataString,
cache: false,
success: function(html){
Finally, I want to prepend the user's comments to the top of a specific div (with id="test"). I have attempted the following methods:
$('#test').prepend('<div style="width:100%; overflow:auto;">comment</div>');
And also,
$('#test').prepend('<div style="width:100%; overflow:auto;">'comment'</div>');
Unfortunately, neither of these solutions are working as expected. Is there a better approach or another way to achieve this functionality?