时间戳

首页 > 解决方案 > 单击我的按钮时，Ajax 代码不起作用

php - 单击我的按钮时，Ajax 代码不起作用

问题描述

我正在建立一个评论系统，我正在使用 ajax 添加和显示评论而不刷新页面，但是添加评论的代码对我不起作用，我没有看到任何错误，什么都没有改变我点击按钮，你能告诉我怎么了吗？

我试图将 $('#comment_form').on('submit', function(event){ 更改为 $(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);

?>

标签： phpmysqlajax

解决方案

您可以尝试使用 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;
}

并在您的聊天中显示它，只需创建一个 id = foo 的 div。

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

推荐阅读