如何传递一个值到同一页时,一个表单提交?使用Ajax


How to pass a value to the same page when a form submitted? Using Ajax

基本上,表单必须发送数据到我的数据库和我的数据库信息应该显示在同一页面,当用户提交表单而不刷新页面。我做错了什么,找不到解决办法。我看了所有的问题,但还是不明白。谢谢你的帮助。

 <div  id="tweetSpace">
      <form id="formTweet" method="post" >
        <textarea id="areaTweet" name="message" rows="2" cols="120" placeholder="Write your tweet here..."></textarea>
        <br>
        <input id="sendTweet" type="submit" value="Send">
      </form>
    </div>
    <div id="txtHint"></div>
<script>
$("#sendTweet").on("submit", function(e){

    var tweet = $('areaTweet').val();
    var update = $('#txtHint');
    $.ajax({
        type: 'POST',
        url: 'tweet2.php',
        data: , tweet,  
        success:function(html){
           update.html(html);
        }
    });
});

</script>

tweet2.php文件
<?php 
 include 'connect.php';
  session_start();
$tweet=$_POST['tweet'];
$email =$_SESSION['login_user'];
$sqlr = "INSERT INTO tweets(tweet,member_email) VALUES ('$tweet','$email')";
$rqu = mysqli_query($conn,$sqlr);

$x=0;
$arrayName = array();
$sql= "SELECT tweet FROM tweets WHERE member_email= '$email' "
$rq = mysqli_query($conn,$sql);
while($row = mysqli_fetch_assoc($rq)) {
           $arrayName[$x]  = $row["tweet"];
           $x=$x+1;
}

<?php for($k = 0; $k < $x; $k++) {?>
 <p><?php echo  $arrayName[$k]; ?></p>
<?php } ?

?>

下面是工作代码…注意所有更改都在两个文件中完成。

<html>
<head>
    <title>Tweets</title>
</head>
<body>
    <div id="tweetSpace">
      <form id="formTweet" method="post" >
        <textarea id="areaTweet" name="message" rows="2" cols="120" placeholder="Write your tweet here..."></textarea>
        <br>
        <input id="sendTweet" type="button" value="Send">
      </form>
    </div>
    <div id="txtHint"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
<script>
  $("#sendTweet").click(function(e){
      var tweet = $('#areaTweet').val();
      var update = $('#txtHint');
      $.ajax({
          type: 'POST',
          data: {'tweet':tweet},
          url: 'tweet2.php',
          success:function(html){
             update.html(html);
          }
      });
  });
</script>
</body>
</html>

tweet2.php

<?php 
session_start();
include 'connect.php';
/*
$servername = "localhost";
$username = "root";
$password = "";
$db = "sflow";
$conn = mysqli_connect($servername, $username, $password, $db); 
*/
$tweet = $_POST['tweet'];
$email = /*"sample@s.com";//*/$_SESSION['login_user'];
$sqlr  = "INSERT INTO tweets(tweet,member_email) VALUES ('$tweet','$email')";
$rqu   = mysqli_query($conn,$sqlr);
$x=0;
$arrayName = array();
$sql= "SELECT tweet FROM tweets WHERE member_email= '$email'";
$rq = mysqli_query($conn,$sql);
while($row = mysqli_fetch_assoc($rq)) {
           $arrayName[$x]  = $row["tweet"];
           $x=$x+1;
}
for($k = 0; $k < $x; $k++)
echo '<p>'.$arrayName[$k].'</p>';
?>
样本表

CREATE TABLE IF NOT EXISTS `tweets` (
  `ID` int(11) unsigned NOT NULL AUTO_INCREMENT,
  `tweet` varchar(255) NOT NULL,
  `member_email` varchar(255) NOT NULL,
  PRIMARY KEY (`ID`),
  UNIQUE KEY `sid_2` (`tweet`),
  KEY `sid` (`tweet`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=3 ;
--
-- Dumping data for table `tweets`
--
INSERT INTO `tweets` (`ID`, `tweet`, `member_email`) VALUES
(1, 'sasa', 's@g.com'),
(2, 'fgfg', 'sample@s.com');

是一个额外的逗号在你的ajax之前的tweet?data: , tweet,

如果是,它将不起作用。应该是data: tweet,

你不想刷新页面,所以必须使用preventDefault,但它只适用于表单id。所以需要用表单id改变提交按钮id。第二件事是你的数据格式函数必须像json {key : value}

$("#formTweet").on("submit", function(e){
e.preventDefault(); //prevent refresh page
var tweet = $('#areaTweet').val();
var update = $('#txtHint');
$.ajax({
    type: 'POST',
    url: 'tweet2.php',
    data: {tweet:tweet},  
    success:function(html){
       update.html(html);
    }
});
});
我认为你需要修改你的tweet2.php

<?php 
 include 'connect.php';
  session_start();
$tweet=$_POST['tweet'];
$email =$_SESSION['login_user'];
$sqlr = "INSERT INTO tweets(tweet,member_email) VALUES ('$tweet','$email')";
$rqu = mysqli_query($conn,$sqlr);
$sql= "SELECT tweet FROM tweets WHERE member_email= '$email' ";
$rq = mysqli_query($conn,$sql);
while($row = mysqli_fetch_assoc($rq)) {
           echo  "<p>".$row["tweet"]."</p>";
}
?>

确保设置exit();在tweet2.php文件的末尾。然后只有你才能得到回应。此外,您应该以data: {tweet:tweet}格式的形式定义数据。twitter变量将与ajax一起进入php文件。

$ (" # sendTweet ")。("提交"、功能(e) {

var tweet = $('areaTweet').val();
var update = $('#txtHint');
$.ajax({
        type: 'POST',
        url: 'tweet2.php',
        data: {tweet:tweet},  
        success:function(html){
           update.html(html);
        }
    });
});

而不是这个var tweet = $('areaTweet').val();

使用

var tweet = $('#areaTweet').val();