使用 PHP 获取 AJAX POST

Question

我在表单中有一个drpcategory 下拉菜单。我将在下面粘贴下拉代码；

<div class="form-group">
     <label>Category</label>
     <select class="form-control bg-dark btn-dark text-white" id="drpcategory" name="drpcategory" required>
     <?php
          $category = ''.$dir.'/template/post/category.txt';
          $category = file($category, FILE_IGNORE_NEW_LINES);

          foreach($category as $category)
          {
              echo "<option value='".$category."'>$category</option>";
          }
     ?>
     </select>
</div>

然后我每次在上面的drpcategory 下拉列表中进行选择时，我都会 AJAX post，如下所示；

<script>
$(function(){

$('#drpcategory').on('change',function()
{

$.ajax({
method: 'post',
data: $(this).serialize(),
success: function(result) {
console.log(result);
}
});

});    

});
</script>

这似乎目前正在工作，因为我每次制作时都会在 Chrome 浏览器 > Inspect > Network 选项卡中获得如下输出drpcategory 中的一个选择。这是截图；

问题是我如何在同一页面中使用 PHP 捕获此 AJAX post 数据并在同一页面中捕获 echo 它？到目前为止，我已经尝试过；

<?php 
  if(isset($_POST['drpcategory']))
  {
    echo 'POST Received';
  }
?>

我正在寻找仅结合使用 PHP、JQuery 和 AJAX 的解决方案。

这个问题后来在这里更新和回答： AJAX POST & PHP POST In Same Page

Answer 1

首先，这一行 -> type: $(this).attr('post') 应该是 type: $(this).attr('method'), 。所以这将给出值 ** type:post** 和

据我了解，每当您从 drpcategory 中选择选项时，您都会要求发送 ajax。你为什么要为此提交整个表格。如果我在你那里，我应该按照以下方式解决这个问题

$("#drpcategory").change(function(){
e.preventDefault();
var drpcategory=$(this).val();
$.ajax({
   type: 'post',
   data: drpcategory,
   success: function(result) {
        console.log(result);
   }
});
});

在你的php端，你可以得到你的数据，

echo $_POST['drpcategory'];

Answer 2

我建议你阅读 ajax 函数的文档，我尝试复制它，我必须解决这个问题：

$.ajax({
    // If you don't set the url
    // the request will be a GET to the same page
    url: 'YOU_URL',
    method: 'POST', // I replaced type by method
    data: $(this).serialize(),
    success: function(result) {
        console.log(result);
    }
});

http://api.jquery.com/jquery.ajax/

输出：

Answer 3

First change to $value

<div class="form-group">
 <label>Category</label>
 <select class="form-control bg-dark btn-dark text-white" id="drpcategory" name="drpcategory" required>
 <?php
      $category = ''.$dir.'/template/post/category.txt';
      $category2 = file($category, FILE_IGNORE_NEW_LINES);

      foreach($category2 as $value)
      {
          echo "<option value='".$value."'>".$value."</option>";
      }
 ?>
 </select>

然后添加网址

<script>
 $(function()
 {
   $('#form').submit(function(e)
   { 
      e.preventDefault();
      $.ajax({
          url:'folder/filename.php',
          type: 'post',
          data: '{ID:" . $Row[0] . "}',
          success: function(result) {
              console.log(result);
          }
      });
   });
   $('#drpcategory').on('change',function()
   {
      $("#form").submit();
   });
 });

尝试请求

if(isset($_REQUEST['ID']))

结果将/应该发送回同一页面

Answer 4

请试试这个代码：

$.post('URL', $("#FORM_ID").serialize(), function (data)
{
  alert('df);
}

Answer 5

我认为您在 ajax jQuery resquest 中存在错误语法错误，因为 ajax post 'http://example.com/?page=post&drpcategory=Vehicles' 不会在浏览器网络选项卡中返回此类型的 url。

<?php var_dump($_POST); exit; ?> please do this statment in your php function if anything posted to php page it will dump.

这里是ajax请求示例

$("#drpcategory").change(function(){

e.preventDefault();

var drpcategory=$(this).val();

$.ajax({

类型：'发布'，

数据：drpcategory，

成功：函数（结果）{

    console.log(result);

}

});

});

`

Answer 6

听起来您正在尝试同时解决几件事。在我开始直接的问题之前，我们需要进行一些基础工作，以便您了解需要发生的事情。

首先，关于 URL 的混淆：

您正在通过 index.php 路由所有内容。因此，index.php 需要遵循如下结构：

<?php 
// cleanse any incoming post and get variables

// if all your POST requests are being routed to this page, you will need to have a hidden variable 
// that identifies which page is submitting the post. 

// For this example, assume a variable called calling_page.  
// As per your naming, I'll assume it to be 'post'.

// Always check for submitted post variables and deal with them before doing anything else.
if($_POST['calling_page'] == 'post') {
  // set header type as json if you want to use json as transport (recommended) otherwise, just print_r($_POST);
  header('Content-Type: application/json');

  print json_encode(array('message' => 'Your submission was received'));
  
  // if this is from an ajax call, simply die.  
  // If from a regular form submission, do a redirect to /index.php?page=some_page
  die; 
}

// if you got here, there was no POST submission.  show the view, however you're routing it from the GET variable.
?>
<html>
  (snip)
  <body>
    <form id="form1" method="post">
      <input type="hidden" name="calling_page" value="page" />
      ... rest of form ...
      <button id="submit-button">Submit</button>
    </form>

}

现在，关于 JQuery 和 AJAX 的困惑：

根据https://api.jquery.com/jquery.post/，您必须提供一个 URL。

除了 url 之外的所有属性都是可选的

您的 JQuery AJAX 将向您的 index.php 页面发送一个发布请求。当您的页面如上所示执行时，它将简单地打印{message: "Your submission was received"}，然后死掉。 JQuery 将等待该响应，然后执行您告诉它执行的任何操作（在此示例中，将其打印到控制台）。

---

讨论后更新

<div class="form-group">
     <label>Category</label>
     <select class="form-control bg-dark btn-dark text-white" id="drpcategory" name="drpcategory" required>
     <?php
          $category = ''.$dir.'/template/post/category.txt';
          $category = file($category, FILE_IGNORE_NEW_LINES);

          foreach($category as $category)
          {
              echo "<option value='".$category."'>$category</option>";
          }
     ?>
     </select>
</div>

<!-- HTML to receive AJAX values -->
<div>
  <label>Item</label>
  <select class="" id="drpitem" name="drpitem"></select>
</div>





<script>
  $(function(){

    $('#drpcategory').on('change',function() {
      $.ajax({
        url: '/receive.php',
        method: 'post',
        data: $(this).serialize(),
        success: function(result) {
          workWithResponse(result);
        }
      });

    });    

  });


  function workWithResponse(result) {

    // jquery automatically converts the json into an object.
    // iterate through results and append to the target element

    $("#drpitem option").remove();
    $.each(result, function(key, value) {   
         $('#drpitem')
             .append($("<option></option>")
                        .attr("value",key)
                        .text(value)); 
    });        
          }

</script>

receive.php：

<?php 
// there can be no output before this tag.

if(isset($_POST['drpcategory']))
{
  // get your items from drpcategory.  I will assume: 
  $items = array('val1' => 'option1','val2' => 'option2','val3' => 'option3');

  // send this as json.  you could send it as html, but this is more flexible.
  header('Content-Type: application/json');

  // convert array to json
  $out = json_encode($items);

  // simply print the output and die.
  die($out);


}

一切正常后，您可以从receive.php 获取代码，将其粘贴在index.php 的顶部，然后将ajax 调用重新指向index.php。确保在此代码 sn-p 之前没有输出可能。