Код Ajax не работает при нажатии моей кнопки

Question

Я настраиваю систему комментариев и использую ajax для добавления и отображения комментариев без обновления страницы, но код, который добавляет комментарии, не работает для меня, и я не вижу ошибок,когда я нажимаю кнопку, ничего не меняется, вы можете сказать мне, что не так?

Я пытался изменить $ ('# comment_form'). on ('submit', function (event) {TO $ (document).on ('click', 'submit', function () {и много изменений, но это то же самое.

вот мой код: -основная страница

<div class="col-md-6">
    <h3>Add a comment</h3>

 <form action="" class="form-inline" id="comment_form" method="POST">

  <div class="form-group">
     <textarea name="commentaire" id="commentaire" cols="60" rows="10" 
     class="form-control"></textarea>
        </div>
        <div class="form-group">
            <input type="submit" class="btn btn-primary" value="ENVOYER" 
id="submit" name="submit">
        </div>
    </form>
<span id="comment_message"></span>
</div>

<script>
$(document).ready(function(){
$('#comment_form').on('submit', function(event){
event.preventDefault();
var form_data = $(this).serialize();
var id = <?php echo $id; ?>;
$.ajax({
url:"add_comment.php",
method:"POST",
data:{form_data,id}, 
dataType:"JSON",
success:function(data)
{
if(data.error != '')
{
 $('#comment_form')[0].reset();
 $('#comment_message').html(data.error);
 load_comment();
}
}
})
});
</script> ```

-комментарий add_comment.php страница:

<?php
require_once("../Ressources/Config.php");



$error = '';
$comment_content = '';
$id_user=$_SESSION['id_user'];
$id_produit=$_GET['id'];

if(empty($_POST["commentaire"]))
{
 $error .= '<p class="text-danger">Comment is required</p>';}
else
{
$comment_content = $_POST["commentaire"];
}

if($error == '')
{
$query =query(" INSERT INTO commentaires (id_produit, id_user, com, 
date_a) 
VALUES ($id_produit, $id_user, $comment_content, curdate()) ");
confirm($query);


$data = array(
'error'  => $error
);

echo json_encode($data);

?>

Answer 1

Вы можете попытаться использовать XMLHTTP AJAX вместо jQuery ...

По сути, у вас будет что-то вроде этого в вашем javascript:

function createRequestObject() {
var ro;
var browser = navigator.appName;
if(browser == "Microsoft Internet Explorer"){
    ro = new ActiveXObject("Microsoft.XMLHTTP");
}else{
    ro = new XMLHttpRequest();
}
return ro;
}

 var http = createRequestObject();

function sndReq(action) {
http.open('get', 'rpc.php?action='+action+'&arg='+document.getElementByID('commentaire').value);
http.onreadystatechange = handleResponse;
http.send(null);
}

function handleResponse() {
if(http.readyState == 4){
    var response = http.responseText;
    var update = new Array();

    if(response.indexOf('|' != -1)) {
        update = response.split('|');
        document.getElementById(update[0]).innerHTML = update[1];
    }
 }
}

И вы бы использовали его, создав «кнопку» (или ссылку) ...

 <a class = "button" href="javascript:sndReq('foo')">Send Chat</a>

... и стиль, чтобы он выглядел как кнопка.

.button {
font: bold 11px Arial;
text-decoration: none;
background-color: #EEEEEE;
color: #333333;
padding: 2px 6px 2px 6px;
border-top: 1px solid #CCCCCC;
border-right: 1px solid #333333;
border-bottom: 1px solid #333333;
border-left: 1px solid #CCCCCC;
}

Затем, чтобы получить свой комментарий в своем php-файле, просто выполните:

switch($_REQUEST['action']) {
case 'foo':
 $arg = $_REQUEST["arg"];
  /* do something with $arg (aka. the comment) */
  echo "foo|$arg";
  break;
}

и для отображения в чате просто создайте div с id = foo.

<div id="foo">
</div>