Error retrieving indexes using $_POST from skeleton table in Ajax. Undefined index

Question

So, I'm trying to make a live interactive table that can do active CRUD, but for some reason, the values I'm trying to insert for the add feature are not correctly being read to $_POST.

Here is the table:

<?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;
?>

Here it the live data edit file:

<!-- 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>

Here is the insert file:

<?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';
 }
 ?>

The error I get is:

Notice: Undefined index: userfirstname in /var/www/html/UOM/UViewTABLEinsert.php on line 4

Notice: Undefined index: userlastname in /var/www/html/UOM/UViewTABLEinsert.php on line 4

And, I know that means in my edit file, I'm not defining those indexes properly, but I can't see anything wrong with it. I have researched this problem for 3 days, if someone is kind enough to help, please do, evidently I don't know what I'm doing wrong.

Try by removing `dataType` in ajax options, may work. – Girish Jul 21 '17 at 04:53 — Girish, Jul 21 '17 at 04:53

score 0 · Answer 1 · answered Jul 21 '17 at 05:02

0

Just remove the dataType from ajax options because you are explicitly setting the data type to text, the data is not submitting in key value pair, and after insertion, send response in JSON, may work. For more about $.ajax's dataType option, refer this. If you want to set dataTyp explicitly, then keep the response in same type as set in ajax request.

answered Jul 21 '17 at 05:02

Girish

213
2
13

Refer the following link, may help : https://stackoverflow.com/questions/6974684/how-to-send-formdata-objects-with-ajax-requests-in-jquery – Girish Aug 07 '17 at 07:03

Error retrieving indexes using $_POST from skeleton table in Ajax. Undefined index

1 Answers1