Question

plz添加我的代码无法正常工作

我希望用户在页面accueil上创建没有刷新页面的帖子 //表单的代码html（标题，文本）

<form class="posting" method="POST" enctype="multipart/form-data"> 

<input type="text" name="title" class="title-input" placeholder="Quelle est votre question... ?"
autocomplete="off">

<textarea name="text" id="text" class="textarea" cols='60' rows='8' ></textarea>

<button class="btn-ajouter" type="submit" onclick="get()" name="ajouter" value="ajouter">ajouter</button>         
</form>

// code php create post（user）

if(isset($_POST['ajouter']) && !empty($_POST['text']) && isset($_POST['title']) )
{
  $texte = htmlspecialchars($_POST['text']);
  $title = htmlspecialchars($_POST['title']);

 $stmt=$connect->prepare('INSERT INTO

  publications(title_post,post) VALUES(?,?) ');

  $stmt>execute(array($texte,$title)); 
 }

//代码显示结果（页面accueil）（页面accueil）

<div id="result">
 <?php 
  $stmt = $connect->query('SELECT *FROM publications ');

  while($row=$stmt->fetch() )
    {
      echo $row['title_post'] ; 
      echo $row['post'];
 ?>
</div>

//代码ajax

     function get(){
      var result ;
      if(window.XMLHttpRequest)
      result = new XMLHttpRequest();

      else

      result = new ActiveXObject('Microsoft.XMLHTTP');

      result.onreadystatechange = function()
       { 
      if(result.readyState == 4 & result.status == 200)              
            document.getElementById('allpost').innerHTML = 
                                                      result.responseText;
       }

                  result.open('POST','accueil.php',false);
                  result.setRequestHeader('Content-type','application/x-www-
                   form-urlencoded');
                  result.send();


               }

Answer 1

你的ajax方法应该是这样的，因为你现在没有传递任何数据。（别忘了在标题输入中添加id）

var data = {
  title: document.getElementById('title').value,
  text: document.getElementById('text').value
};
var request = new XMLHttpRequest();
request.open('POST', 'accueil.php', true);
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
request.send(data);

Answer 2

您应该不听来提交button上的点击事件，因为用户可以在不点击（TAB + ENTER）的情况下提交表单。相反，您应该直接在form元素上监听提交事件。

<form class="posting" method="POST" onsubmit="get(event);" enctype="multipart/form-data">

现在，当提交form时，您将在get()函数中收到事件变量，因此您必须将函数参数更改为get(e)。

在您的函数体内，您现在可以使用 preventDefault 方法：

e.preventDefault();

Answer 3

首先，你的create post execute命令中有一个拼写错误。你需要 - ＆gt;不只是＆gt;

其次，您需要在send命令中发送数据。这可以手动处理，或者只是设置FormData对象：

var form = document.getElementById("formID");
var data = new FormData(form);
var xmlhttp = new XMLHttpRequest();
xmlhttp.open("POST", "form_processing.php");
xmlhttp.send(data);

Answer 4

也许你可以改变代码的某些部分，并尝试添加一个监听器，之后，你可以防止默认

定义id，或在DOM

中获取/获取表单对象的内容

在此代码中，我使用id="myForm"来获取/获取对象，并在添加侦听器之后。

<form id="myForm" class="posting" method="POST"enctype="multipart/form-data">

现在你将获得对象

document.getElementById("myForm");或者如果您使用的是jQuery $("#myForm")

设置侦听器（使用默认JavaScript）

如果您没有使用jQuery，可以使用此代码添加监听器

element.addEventListener("submit", yourCallbackFunction(event), false);

设置监听器（使用jQuery）

element.submit(yourCallback(event))

现在只是防止事件违约

event.preventDefault()

以你的方式做你的AJAX提交

我希望我有所帮助

Answer 5

您的HTML提交应该像Ajax一样设置。

<button class="btn-ajouter" type="button" onclick="myGetFunction();" name="ajouter" value="ajouter">ajouter</button>

并为标题输入设置ID

<input id="title" type="text" name="title" class="title-input" placeholder="Quelle est votre question... ?">

这就是你的Ajax应该如何看待你有一些结构性问题。请注意，我得到了表单元素，并将一个字符串传递给您的php。

var request = false;
if(window.XMLHttpRequest){
request = new XMLHttpRequest();
} else if (window.ActiveXObject){
request = new ActiveXObject("Microsoft.XMLHTTP");}
function myGetFunction(){
if(request){
request.open("POST", "calls/accueil.php");
request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
request.onreadystatechange = function(){
if(request.readyState == 4 && request.status == 200){
document.getElementById('returnKeys').innerHTML = RequestObject.responseText;}}
var title = document.getElementById('title').value;
var text = document.getElementById('text').value;
var data = title+'|'+text+'|';
RequestObject.send("data=" + data);}
return false;}

你应该有一个PHP页面进行这样的处理。

$data = $_POST['data'];
list($title, $text) = explode('|', $data);
if(isset($_POST['data'])){
if($title == '' || $text == ''){
if ($title == '') { $error['title'] = 'Username is Required.'; }
if ($text == '') { $error['text'] = 'Password is Required.'; }
$response = "Username and Password are Required to Continue.";
echo $error['title'];
echo $error['text'];
echo $response;
exit();
} else {
$text = htmlspecialchars($text);
$title = htmlspecialchars($title);
$stmt=$connect->prepare("INSERT INTO publications(title_post,post) VALUES ('".$title."', '".$text."'"));
$stmt>execute; 
$stmtb = $connect->query('SELECT * FROM publications ');
while($row=$stmtb->fetch() )
{
$mydata = $row['title_post'] ; 
$mydata .= $row['post'];
}
}
}
echo $mydata;

提交没有页面刷新的表单不起作用

5 个答案:

定义id，或在DOM

设置侦听器（使用默认JavaScript）

设置监听器（使用jQuery）

现在只是防止事件违约

以你的方式做你的AJAX提交