从Ajax中的骨架表使用$ _POST检索索引时出错。未定义的索引

时间:2017-07-21 00:01:46

标签: php jquery html ajax

所以,我试图创建一个可以执行活动CRUD的实时交互式表格,但由于某种原因,我尝试为添加功能插入的值未正确读取到$ _POST 。

这是表格:

<?php
include "../db.php";
$connection = DB::CreateConnection();
$output = '';
$sql = "SELECT * FROM users ORDER BY userid ASC";
$result = mysqli_query($connection, $sql);
$output .= '
     <div class="table-responsive">
          <table class="table table-bordered">
               <tr>
                    <th width="10%">Id</th>
                    <th width="40%">First Name</th>
                    <th width="40%">Last Name</th>
                    <th width="10%">Delete</th>
               </tr>';
if(mysqli_num_rows($result) > 0)
{
     while($row = mysqli_fetch_array($result))
     {
          $output .= '
               <tr>
                    <td>'.

$row["userid"].'</td>
                    <td class="userfirstname" data-id1="'.$row["userid"].'" contenteditable>'.$row["userfirstname"].'</td>
                    <td class="userlastname" data-id2="'.$row["userid"].'" contenteditable>'.$row["userlastname"].'</td>
                    <td><button type="button" name="delete_btn" data-id3="'.$row["userid"].'" class="btn btn-xs btn-danger btn_delete">x</button></td>
               </tr>';
     }
     $output .= '
          <tr>
               <td></td>
               <td id="userfirstname" contenteditable></td>
               <td id="userlastname" contenteditable></td>
               <td><button type="button" name="btn_add" id="btn_add" class="btn btn-xs btn-success">+</button></td>
          </tr>';
}
else
{
     $output .= '<tr>
                         <td colspan="4">Data not Found</td>
                </tr>';
}
$output .= '</table>


     </div>';
echo $output;
?>

这里是实时数据编辑文件:

<!-- This should be where matt's code goes to edit via popup or live -->
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
  <body>
    <div class="container">
      <br />
      <br />
      <br />
      <div class="table-responsive">
          <h3 align-"center">Live Table</h3>
          <br />
          <div id="live_data"></div>
      </div>
    </div>
  </body>
  <script type="text/javascript">
  function fetch_data()
  {
       $.ajax({
            url:"UViewTABLE.php",
            method:"POST",
            success:function(data){
                 $('#live_data').html(data);
            }
       });
  }
 fetch_data();
 $(document).on('click', '#btn_add', function(){
          var userfirstname = $('#userfirstname').text();
          var userlastname = $('#userlastname').text();
          if(userfirstname == '')
          {
               alert("Enter First Name");
               return false;
          }
          if(userlastname == '')
          {
               alert("Enter Last Name");
               return false;
          }
          $.ajax({
               url:"UViewTABLEinsert.php",
               method:"POST",
               data:{userfirstname:userfirstname, userlastname:userlastname},
               dataType:"text",
               success:function(data)
               {
                    alert(data);
                    fetch_data();
               }
          })
     });
  </script>

这是插入文件:

<?php
include "../db.php";
$connection = DB::CreateConnection();
$sql = "INSERT INTO users (userfirstname, userlastname) VALUES('".$_POST["userfirstname"]."', '".$_POST["userlastname"]."')";
 if(mysqli_query($connection, $sql))
 {
      echo 'Data Inserted';
 }
 ?>

我得到的错误是:

  

注意:未定义索引:userfirstname in   第4行的/var/www/html/UOM/UViewTABLEinsert.php

     

注意:未定义的索引:userlastname in   第4行的/var/www/html/UOM/UViewTABLEinsert.php

并且,我知道这意味着在我的编辑文件中,我没有正确定义这些索引,但我看不出它有什么问题。我已经研究了这个问题3天了,如果有人能够提供帮助,请这样做,显然我不知道自己做错了什么。

1 个答案:

答案 0 :(得分:0)

只需从ajax选项中删除dataType,因为您明确将数据类型设置为文本,数据未在键值对中提交,插入后,以JSON发送响应可能有效。有关$.ajax的{​​{1}}选项的更多信息,请参阅this。如果要显式设置dataType,请将响应保持为与ajax请求中设置的相同类型。