Question

好的，我正在尝试使用ajax。我尝试了几种方法，但没有任何方法可以帮助我。我相信我遇到的主要问题是ajax不会添加到我的数据库中，剩下的就是我可以管理的。

以下是相关的ajax代码：

$(document).ready(function(){
console.log($("going to attach submit to:","form[name='threadForm']"));
$("form[name='threadForm']").on("submit",function(e){
    e.preventDefault();
    var message = $("#message").val();
   //assumming validate_post returns true of false(y)
   if(!validatepost(message)){
       console.log("invalid, do not post");
       return;
   }
   console.log("submitting threadForm");
   update_post(message);
});
});

function update_post(message){
    var dataString = "message=" + message;
    alert(dataString);

    $.ajax({
        url: 'post_process.php',
        async: true,
        data: dataString ,
        type: 'post',
        success: function() {
            posts();
        }
    });
 }

 function posts(){
     console.log("getting url:",sessionStorage.page);
     $.get(sessionStorage.page,function(data){
         $("#threads").html(data);
     });
 }

 function validatepost(text){
     $(document).ready(function(){

    var y = $.trim(text);
    if (y==null || y=="") {
        alert("String is empty");
        return false;
    } else {
        return true;
    }
    }); 
  }

这是post_process.php：

<?php
    // Contains sessionStart and the db-connection
require_once "include/bootstrap.php";   

$message = $con->real_escape_string($_POST["message"]); 

if (validateEmpty($message)){
    send();
}

function send(){
    global $con, $message;

    $con->create_post($_SESSION['username'], $_SESSION['category'], $_SESSION("subject"), $message);
}

//header("Location: index.php");
?>

最后，这是html-form：

<div id="post_div">
<form name="threadForm" method="POST" action="">
    <label for="message">Meddelande</label><br>
    <textarea id="message" name="message" id="message" maxlength="500">

    </textarea><br>
    <input type="submit" value="Skicka!" name="post_btn" id="post_btn"><br>
</form>

create_post是我写的一个函数，在我介绍ajax之前，其他一切正常。

就像现在一样，没有达到console.log：S。

Ajax在网站上的页面之间跳转时起作用，但上面的代码现在什么都不做。而且，如果我将post_process.php作为表单操作并且不在post_process-php中注释掉标题，它就可以工作。

我为忘记一些信息而道歉。我很累，只是想让它起作用。

Answer 1

我首先通过删除button.submit.onclick并生成form.onsubmit = return update_post来测试update_post。如果成功，则将validate_post作为条件放在update_post中，如果（！validate_post（this））{return false;}

如果它没有成功，则问题出在php中。

您还可以调用posts（）来执行$ .get所做的操作。你可以简单地在ajax返回中调用$ .get。我不清楚你要在＆＃34;帖子＆＃34;功能

Answer 2

首先，您可以将表单提交给PHP，看看PHP是否完成了它应该做的事情。如果是，那么尝试使用JavaScript提交：

$("form[name='threadForm']").on("submit",function(e){
  e.preventDefault();
  //assumming validate_post returns true of false(y)
  if(!validate_post()){
    console.log("invalid, do not post");
    return;
  }
  console.log("submitting threadForm");
  update_post();
});

在安装了firebug插件的Chrome或firefox中按F12，看看是否有任何错误。 POST也应该在控制台中显示，以便您可以检查发布的内容。请注意，当您没有打开控制台时，console.log会在IE中导致错误（按F12打开），如果要支持IE，则应删除日志。

你的功能帖子可以使用jQuery，也可以缩短代码：

function posts(){
  console.log("getting url:",sessionStorage.page);
  $.get(sessionStorage.page,function(data){
    $("#threads").html(data);
  });
}

<强>更新

如果在将事件监听器附加到表单时找到表单，您可以控制日志吗？

console.log($("going to attach submit to:","form[name='threadForm']"));
$("form[name='threadForm']").on("submit",function(e){
   ....

然后将表单的操作设置为google.com或其他内容以查看表单是否已提交（如果代码有效则不应该）。然后检查控制台以查看xhr请求，看看请求/响应中是否有任何错误。

查看您的代码，似乎您的帖子ajax请求错误。

function update_post（message）{ 的console.log（消息）;

$.ajax({
    url: 'post_process.php',
    async: true,
    //data could be a string but I guess it has to
    // be a valid POST or GET string (escape message)
    // easier to just let jQuery handle this one
    data: {message:message} ,
    type: 'post',
    success: function() {
        posts();
    }
});

<强>更新

绑定到提交事件有问题。以下是一个如何完成的示例：

<!DOCTYPE html>
<html>
  <head>
    <script src="the jquery library"></script>
  </head>
  <body>
<form name="threadForm" method="POST" action="http://www.google.com">
    <label for="message">Meddelande</label><br>
    <textarea id="message" name="message" id="message" maxlength="500">
    </textarea><br>
    <input type="submit" value="Skicka!" name="post_btn" id="post_btn"><br>
</form>
      <script>
$("form[name='threadForm']").on("submit",function(e){
  e.preventDefault();
  console.log("message is:",$("#message").val());
});   
      </script>
  </body>
</html>

即使消息有2个id属性（你应该删除一个）它工作正常，表单没有提交。也许你的html是无效的，或者你没有附加事件处理程序但看着你更新的问题我认为你有如何使用document.ready错误，在我的例子中我不需要使用document.ready因为脚本访问加载html后的表单，如果脚本位于定义表单的html代码之前，则应使用文档就绪。

Ajax，添加到数据库并更新div内容

2 个答案: