使用jquery从数据库中选择数据不会获得值

hi guys i've a problem here i made a project and in that project have a function for calling data from database for displaying in the table. i've check the php function but it running well. i've thinking i've an eror at my jquery but i dont know where the eror and how to fix it. please help me i hope anyone can solve my problem and give any correction on my code

Here my code (JQUERY,PHP,HTML)

$(document).on('click','#show',function(e) {
    var data = $("#form_input4").serialize();

    $('#table_1 tbody').empty();
        $.ajax({
            data: data,
            type: "Post",
            url: "../php/bkk_1/bkk_show.php",
            success: function(data){
  var list = JSON.parse(data);
  for(var i = 0; i < list.length; i++){
                $('#mat').val((list[i]['material']));
                $('#lok').val((list[i]['lokasi']));
                $('#kpl').val((list[i]['kapal']));
                $('#po_numb').val((list[i]['po']));
                $('#date').val((list[i]['tanggal']));

                var tr = "<tr>";

                tr += "<td>" +list[i]['no']+"</td>";
                tr += "<td>" +list[i]['no_pol']+"</td>";
                tr += "<td>" +list[i]['netto']+"</td>";
                tr += "</tr>";
                $("#table_1 tbody").append(tr);
  }
  return false;
}
});
});

<?php
$con=mysqli_connect("localhost","root","","silo");

if (!$con) {
  die('Could not connect: ' . mysql_error());
}

$tgl=$_POST['tgl'];
$po=$_POST['no_po'];

// Data for Titik1
$query = mysqli_query($con,"SELECT * FROM bkk_1 WHERE tanggal='$tgl' and po='$po' LIMIT 0, 38");
$rows = array();

while($tmp= mysqli_fetch_assoc($query)) {
    $rows[] = $tmp;
}

echo json_encode($rows);
mysqli_close($con);
?> 

<div id="myModal" class="modal">

  <!-- Modal content -->
  <div class="modal-content">
    <span class="close">&times;</span>
    <div id="content1" class="btn btn-default">
    <p align="center" <strong>Display Data Pada Kondisi: </p></strong>
    <div id="content1" class="btn btn-default">
    <form action="../php/bkk_1/bkk_show.php" id="form_display" method="post">
    <table>
    <tr>
    <td width="50">Tanggal </td>
    <td width="10">:</td>
    <td width="30"><input type="text" id="tgl" type="text" name="tgl" size="15" /></td>
    <td width="10"><img src="../image/show.png"  class="show" name="display" id="display" style="height:35px; width:     40px; padding: 5px 5px;  font-size: 24px;  text-align: center;  cursor: pointer;  outline: none;  color: #fff;
  background-color: #ffff;  border: none;  border-radius: 10px;  box-shadow: 0 2px #000000;"  /></td>
    </tr>
    <tr>
    <td width="50">PO Number </td>
    <td width="10">:</td>
    <td width="30"><input type="text" id="no_po" type="text" name="no_po" size="15" /></td>
    </tr>
    </table>
    </form>
    </div>
    </div>
    </div>
</div>

Your form doesn't have the id="form_input4" which is what you are serializing into your data variable and POSTing to your PHP. Though I suspect what you want is var data = $("#form_display").serialize()

Several things you can do to debug this:

1. console.log($("#form_display").serialize()); to verify the data you are sending into your ajax is what you expect

2. var_dump($_POST); in your PHP file to see that your data is making it to the server in the way you expect

3. var_dump($rows); before you echo it to see if contains the data you expect

4. console.log(list) inside your success callback function