如何修复Ajax请求中未正确设置的POST数据?

时间:2018-10-25 23:58:03

标签: php jquery ajax

我在使用ajax从页面获取POST数据时遇到问题。在jQuery代码中,数据运行平稳,当我提醒数据时它将显示。在ajax请求代码中,来自jquery的数据已成功传递到 showpercent.php 文件中。现在,关于 showpercent.php 的问题,数据POST索引 percentage_id 尚未确定。如何获得POST的价值来解决此问题?

下面是当数据来自时带有按钮的表列表。

 <table>
    <tr>
      <td>
        <button class="btn btn-info show-percentage" title="Click to add view percentages!" data-percentage_id="'.$row['hidden_id'] .'" data-toggle="show-percentage"><i class="glyphicon glyphicon-time"></i></button>
      </td>
    </tr>
 </table>

以下是ajax请求,将数据发送到 showpercent.php 文件中。当我从按钮发出 percentage_id 警报时,数据将显示在警报中,并且ajax已成功传递到特定的php文件中,该文件为 showpercent.php

<script>
$(document).ready(function(){
  $(".show-percentage").click(function(){

    var percentage_id = $(this).data('percentage_id');

    alert("Ajax Landing ID "+landing_id);

    $.ajax({
        url: 'ajax/showpercent.php',
        type: 'POST',
        cache: false,
        data: { percentage_id : percentage_id },

        success: function(data) {
          alert(data);
          $('#add-percentage').modal('show');
          readRecords();
        },
        error: function(request, status, error){
          alert("Error!! "+error);
        }             
    });

    // READ recods when the button is click
    readRecords();
  });

  function readRecords() {
    $.get("ajax/showpercent.php", {}, function (data, status) {
      $(".display_percentage").html(data);
    });
  }
});
</script>

下面是具有选项卡的模式,它将显示来自ajax请求的数据。 display_percentage 类将显示 showpercentage 中的当前数据。

<div id="add-percentage" class="modal fade" tabindex="-1" role="dialog">
    <div class="modal-dialog modal-lg">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">&times;</button>
          <h4 class="modal-title">Fish Landing Percentage</h4>
        </div>

        <div class="modal-body">
          <ul class="nav nav-tabs">
            <li class="active"><a data-toggle="tab" href="#menu1">Add Percentage</a></li>
          </ul>

          <div class="tab-content">
            <div id="menu1" class="tab-pane fade in active">
              <br>
              <div class="display_percentage"></div>
            </div>
          </div>

          <div class="modal-footer">
              <button type="button" id="primary" class="btn btn-primary" onclick="AddPercentage()"> Add Percentage </button>
              <button type="button" id="danger" class="btn btn-danger" data-dismiss="modal">Close</button>
            </div>

        </div>
      </div>
    </div>
  </div>

showpercent.php

此文件将由 readRecords()函数读取,并在触发按钮单击时显示为选项卡类为 display_percentage 的模式。

现在出现了问题,当成功从ajax传递数据时,未正确设置 showpercent.php 中的数据POST,并且由于POST不正确而无法进行mysql处理设置。

<?php
include 'db.php';

$data = '
  <table">
      <thead>
          <tr class="success">
            <th ><center>No.</center></th>
            <th ><center>Percentage ID</center></th>
            <th ><center>Landing ID</center></th>
            <th><center>Percentage</center></th>
            <th><center>Date Added</center></th>
          </tr>
      </thead>';

if(isset($_POST['percentage_id'])){

  $landing_id = $_POST['percentage_id'];
$query = mysqli_query($conn, "SELECT
              percentage.percent_id,
              percentage.landing_id,
              percentage.percentage,
              percentage.date_recorded
              FROM
              percentage
              WHERE percentage.landing_id = '$landing_id'");

  $number = 1;

  while($row = mysqli_fetch_array($query)) {

    $data .= '
      <tr>
        <td><center>' . $number . '</center></td>
        <td><center>' . $row['percent_id'] . '</center></td>
        <td><center>' . $row['landing_id'] . '</center></td>
        <td><center>' . $row['percentage'] . '%</center></td>
        <td><center>' . date("M. d, Y", strtotime($row['date_recorded'])) . '</center></td>
      </tr>';
    $number++;
  }
}else{
  echo 'Percentage id is not set!';
}
  $data .= '
  </table>';

echo $data;
?>

但是在控制台中,传递数据的ajax将平稳运行。

我希望有人能帮助我解决这个问题。

2 个答案:

答案 0 :(得分:0)

尝试: 将此添加到您的html

<button id="percentage_id" class="btn btn-info show-percentage" title="Click to add view percentages!" data-percentage_id="<?=$row['hidden_id'] ?>" data-toggle="show-percentage"><i class="glyphicon glyphicon-time"></i></button>

在获取百分比值之前先设置它的值

使用

添加到您的JavaScript中
$("#percentage_id]").data('percentage_id',loading_id); //setter
var percentage_id = $(this).data('percentage_id'); //getter

答案 1 :(得分:0)

我仔细阅读了您的代码showpercent.php,javascript和html,并注意到了这一点

<button class="btn btn-info show-percentage" title="Click to add view percentages!" data-percentage_id="'.$row['hidden_id'] .'" data-toggle="show-percentage"><i class="glyphicon glyphicon-time"></i></button>

并检查

data-percentage_id="'.$row['hidden_id'] .'" 

您做错了,这不是您将php值转换为html值的方式,如果您尝试获取其值,则会在javascript中返回undefined

这就是为什么

var percentage_id = $(this).data('percentage_id');

在javascript和php中返回未定义

所以用它代替

data-percentage_id="<?php echo $row['hidden_id']; ?>"

所以将您的按钮替换成这样

<button class="btn btn-info show-percentage" title="Click to add view percentages!" data-percentage_id="<? echo $row['hidden_id']; ?>" data-toggle="show-percentage"><i class="glyphicon glyphicon-time"></i></button>

感谢@Keval Mangukiya