我想在用户完成2个输入时从db获取数据,这些是两个日期,1是开始日期,另一个是结束日期。当用户单击该按钮时,它应该在给定输入时从数据库中检索数据。但是当我点击我的按钮时,它什么也没发生。有人知道我的错误在哪里吗?这是我的两个文件。
neutest.php
<html>
<head>
<title>Trapeze Stop Point Protocol</title>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- jQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm"
crossorigin="anonymous">
<!-- fontawesome -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.13/css/all.css" integrity="sha384-DNOHZ68U8hZfKXOrtjWvjxusGo9WQnrNx2sqG0tfsghAvtVlRW3tvkXWZh58N9jp"
crossorigin="anonymous">
<!-- datatables -->
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.css">
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.js"></script>
<!-- style sheet -->
<style>
body
{
margin:0;
padding:0;
background-color:#f1f1f1;
}
</style>
</head>
<body>
<div class="container box">
<h1 align="center">Trapeze Stop Point Protocol</h1>
<br />
<?php
//require('search.php');
$conn = oci_connect('IPA_admin','P0o9i8u7','localhost/IPADB');
If (!$conn)
echo 'Failed to connect to Oracle';
else
echo 'Connected to Database (Dropdown)';
$stid = oci_parse($conn,'SELECT DISTINCT STOPPOINT_NAME FROM STOPPOINT_NAMES');
oci_execute($stid);
?>
<div class="table-responsive">
<br />
<div class="row">
<div align="center" class="col-md-3">
<p>PLEASE SELECT BUSSTATION</p>
<select name="station" id="station"</select>>
<option value="">---Station Wählen---</option>
<?php
while (($row = oci_fetch_array($stid, OCI_BOTH)) !=false) {
?>
<option value="<?php echo $row['STOPPOINT_NAME']; ?>"
<?php
if($row['STOPPOINT_NAME']){
}
?> >
<?php
echo $row['STOPPOINT_NAME'];
?>
</option>
<?php
}
?>
</select>
</div>
<div class="input-daterange">
<div align="col-md-6">
<p>VON</p>
<input type="date" name="start_date" id="start_date" max="3000-12-31" min="1000-01-01" class="form-control">
</div>
<div align="col-md-6">
<p>BIS</p>
<input type="date" name="end_date" id="end_date" min="1000-01-01" max="3000-12-31" class="form-control">
</div>
</div>
</br>
<div align="center" class="col-md-3">
<input type="button" name="filter" id="filter" value="Search" class="btn btn-info" />
</div>
</div>
</br>
<table id="order_data" class="table table-bordered table-striped">
<thead>
<tr>
<th>STOPPOINT ID</th>
<th>STOPPOINT NAME</th>
<th>DATUM</th>
<th>DISTANCE</th>
</tr>
</thead>
<tbody>
<?php
$conn = oci_connect('IPA_admin','*******','localhost/IPADB');
If (!$conn)
echo 'Failed to connect to Oracle';
else
echo 'Connected to Database (SHOW)';
$stid2 = oci_parse($conn, 'SELECT * FROM STOPPOINT_NAMES ORDER BY DATUM');
oci_execute($stid2);
while(($row = oci_fetch_array($stid2, OCI_BOTH)) != false)
{
?>
<tr>
<td><?php echo $row["STOPPOINTID"]; ?></td>
<td><?php echo $row["STOPPOINT_NAME"]; ?></td>
<td><?php echo $row["DATUM"]; ?></td>
<td><?php echo $row["DISTANCE"]; ?></td>
</tr>
<?php
}
?>
</tbody>
</table>
</div>
</div>
<script>
$(document).ready(function(){
$.datepicker.setDefaults({
dateFormat: 'dd-mm-yyyy'
});
$(function(){
$("#from_date").datepicker();
$("#to_date").datepicker();
});
$('#filter').click(function(){
var from_date = $('#from_date').val();
var to_date = $('#to_date').val();
if(from_date != '' && to_date != '')
{
$.ajax({
url:"search.php",
method:"POST",
data:{from_date:from_date, to_date:to_date},
success:function(data)
{
$('#order_table').html(data);
}
});
}
else
{
alert("Please Select Date");
}
});
});
</script>
</body>
</html>
这是按钮点击的代码:
<?php
//search.php
//require('neutest.php');
if(isset($_POST["from_date"], $_POST["to_date"]))
{
$conn = oci_connect('IPA_admin','*******','localhost/IPADB');
$query = oci_parse($conn,'SELECT * FROM STOPPOINT_NAMES WHERE DATUM BETWEEN '.$_POST["from_date"].' AND '.$_POST["to_date"].'');
oci_execute($query);
$output .='
<table class="table table-bordered">
<tr>
<th>STOPPOINT ID</th>
<th>STOPPOINT NAME</th>
<th>DATUM</th>
<th>DISTANCE</th>
</tr>
';
if(oci_num_rows ($query) > 0)
{
while(($row = oci_fetch_array($query, OCI_BOTH)) != false)
{
$output .= '
<tr>
<td>'. $row["STOPPOINTID"] .'</td>
<td>'. $row["STOPPOINT_NAME"] .'</td>
<td>'. $row["DATUM"] .'</td>
<td>'. $row["DISTANCE"] .'</td>
</tr>
';
}
}
else
{
$output .= '
<tr>
<td colspan="5">No Stops Found</td>
</tr>
';
}
$output .= '</table>';
echo $output;
}
?>
答案 0 :(得分:0)
将表单添加到html,并将btn更改为提交到同一页面(如果搜索的php代码在同一页面中)。
HTML:
<from method="post" id="myForm">
<div class="input-daterange">
<div align="col-md-6">
<p>VON</p>
<input type="date" name="start_date" id="start_date" max="3000-12-31" min="1000-01-01" class="form-control">
</div>
<div align="col-md-6">
<p>BIS</p>
<input type="date" name="end_date" id="end_date" min="1000-01-01" max="3000-12-31" class="form-control">
</div>
</div>
</br>
<div align="center" class="col-md-3">
<input type="submit" name="filter" id="filter" value="Search" class="btn btn-info" />
</div>
</form>
JS:
$('#myForm').submit(function (event) {
event.preventDefault();
$.ajax({
url: "urlToPhpFile",
type: "POST",
dataType: 'json'
data: $(this).serialize(),
success: function(result){
}
}
});
});