来自数据库的信息应该显示在网站上,但不会显示

时间:2019-07-08 00:58:42

标签: php html css mysql

我一直在关注有关在网站上显示数据库信息的在线教程,但是当我尝试使用localhost / app_location加载它时,它仅显示标题栏。我不知道为什么它不起作用。有什么建议么 ?

这是我遵循的'https://www.youtube.com/watch?v=oxZj82kh4FA&t=195s'

教程

这是我对代码的看法:

process.php

<?php
$mysqli = new mysqli('localhost', 'root', '', 'testing');

if (mysqli_connect_errno()) {
  echo json_encode(array('mysqli' => 'Failed to connect to MySQL: ' . mysqli_connect_error()));
  exit;
}
$page = isset($_GET['p'])? $_GET['p'] : '';
if($page=='view'){
  $result = $mysql->query("SELECT * FROM tabledit WHERE deleted != '1'");
  while($row = $result->fetch_assoc()){
    ?>

    <tr>
      <td><?php echo $row['bookingId']; ?></td>
      <td><?php echo $row['description']; ?></td>
      <td><?php echo $row['bookingStart']; ?></td>
      <td><?php echo $row['bookingEnd']; ?></td>
    </tr>
    <?php
  })
}else {


header('Content-Type: application/json');

$input = filter_input_array(INPUT_POST);


if ($input['action'] == 'edit') {
    $mysqli->query("UPDATE tabledit SET description='" . $input['description'] . "', bookingStart='" . $input['bookingStart'] . "'
      , bookingEnd='" . $input['bookingEnd'] . "' WHERE bookingId='" . $input['bookingId'] . "'");
} else if ($input['action'] == 'delete') {
    $mysqli->query("UPDATE tabledit SET deleted=1 WHERE bookingId='" . $input['bookingId'] . "'");
} else if ($input['action'] == 'restore') {
    $mysqli->query("UPDATE tabledit SET deleted=0 WHERE bookingId='" . $input['bookingId'] . "'");
}

mysqli_close($mysqli);

echo json_encode($input);
}
?>

index.html:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <meta name="viewpoint" content="width=device-width, initial-scale=1">
    <title>Table</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" >
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.csst"/>
</head>
<body onload="viewData()">

<div class="container" style="margin-top:35px">
  <h4>Table Quick Edit</h4>
  <table id="tabledit" class="table table-bordered table-striped">
    <thead>
      <tr>
        <th>BookingId</th>
        <th>Description</th>
        <th>BookingStart</th>
        <th>BookingEnd</th>
      </tr>
    </thead>
    <tbody></tbody>
  </table>
</div>

<script src="jquery-3.4.1.min.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/jquery.tabledit.js"></script>
<script>
  function viewData(){
    $.ajax({
      url: 'process.php?p=view',
      method:'GET'
    }).done(function(data){
      $('tbody').html(data)
      tableData()
    })
  }
  function tableData(){
    $('#tabledit').Tabledit({
        url: 'process.php',
        eventType: 'dblclick',
        editButton: true,
        deleteButton: true,
        hideIndentifier: false,
        buttons: {
          edit: {
            class: 'btn btn-sm btn-warning',
            html: '<span class="glyphicon glyphicon-pencil"></span> Edit',
            action: 'edit'
          },
          delete: {
            class: 'btn btn-sm btn-danger',
            html: '<span class="glyphicon glyphicon-trash"></span> Trash',
            action: 'delete'
          },
          save: {
            class: 'btn btn-sm btn-success',
            html: 'Save'
          },
          restore: {
            class: 'btn btn-sm btn-warning',
            html: 'Restore',
            action: 'restore'
          },
          confirm: {
            class: 'btn btn-sm btn-default',
            html: 'Confirm'
          }
        },
        columns: {
            identifier: [0, 'bookingId'],
            editable: [[1, 'description'], [2, 'bookingStart'], [3, 'bookingEnd']]
      },
      onSuccess: function(data, textStatus, jqXHR) {
        viewData
      },
      onFail: function(jqXHR, textStatus, errorThrown) {
        console.log('onFail(jqXHR, textStatus, errorThrown)');
        console.log(jqXHR);
        console.log(textStatus);
        console.log(errorThrown);
      },
      onAjax: function(action, serialize) {
        console.log('onAjax(action, serialize)');
        console.log(action);
        console.log(serialize);
      }
    });
  }
</script>
</body>
</html>

我仔细检查了每一行。我每次都运行xampp。它连接到数据库,但不显示任何内容。

1 个答案:

答案 0 :(得分:1)

您正在混合mysql和mysqli

$result = $mysql->query("SELECT * FROM tabledit WHERE deleted != '1'");

应该是

$result = $mysqli->query("SELECT * FROM tabledit WHERE deleted != '1'");