我正在尝试为我的 Web 应用程序创建一个实时搜索方法(在即时输入时显示结果)。我不知道如何正确地将代码实现为 HTML。
这是我在 index.php 中的脚本文件:
<script src="http://code.angularjs.org/angular-1.0.0.min.js"></script>
<script>
PATH = 'cari.php';
var app = angular.module("myApp",[]);
//live search controller for welcome view and welcome controller
app.controller('SearchController', function($scope, $http){
$scope.url = 'cari.php'; // the get request page
$scope.search = function (){
//create the http post request
//the data holds the search key
//the request is a json request
$http.post($scope.url,
{"data" : $scope.keywords}
).success(function (data, status){
$scope.status = status;
$scope.data = data;
$scope.result = data;
}).error(function (data, status){
$scope.data = data || "Request Failed";
$scope.status = status;
});
};
});
</script>
这是我使用 php 搜索数据库的 cari.php 文件:
<?php
require_once './koneksidb.php';
$data = file_get_contents("php://input");
$objData = json_decode($data);
$key = $objData->data;
if(!empty($key)){
$sql = "SELECT * FROM nim_finder WHERE nama LIKE '%$key%' or nim_tpb LIKE '%$key%' or nim_prodi LIKE '%$key%'";
$result = mysqli_query($link, $sql) or die(mysqli_error($link));
$output = array();
while ($row = mysqli_fetch_array($result)) {
$output[] = $row;
}
echo json_encode($output);
}
?>
这是 kondeksidb.php 文件:
<?php
$link = mysqli_connect("hostiscorrect", "usernameiscorrect", "passwordiscorrect", "dbcorrectbelievemeivetried") or die'Error connecting to database: ');
这是我一直在处理的 index.php(与脚本所在的文件相同，但没有任何不相关的内容):
<body ng-app="myApp" ng-controller="SearchController">
<form>
<div class="form-horizontal">
<div class="input-group">
<input ng-model="keywords" name="mhs" id="txtkey" class="form-control" placeholder="Cari nama atau NIM" aria-describedby="ddlsearch" type="text">
<span class="input-group-btn">
<button ng-click="search()" id="btn-search" class="btn btn-info" type="submit"><i class="fa fa-search fa-fw"></i></button>
</span>
</div>
</div>
</form>
<table id="hasil" class="table table-striped table-bordered" width="100%" cellspacing="0">
<thead><tr><th>NIM Prodi</th><th>NIM TPB</th><th>Nama</th><th>Angkatan</th><th>Jurusan</th><th>Email</th></tr></thead>
<tfoot><tr><th>NIM Prodi</th><th>NIM TPB</th><th>Nama</th><th>Angkatan</th><th>Jurusan</th><th>Email</th></tr></tfoot>
<tbody>
<tr ng-repeat="x in result"><td>{{x.nim_prodi}}</td><td>{{x.nim_tpb}}</td><td>{{x.nama}}</td><td>{{x.angkatan}}</td><td>{{x.prodi}}</td><td>{{x.email}}</td></tr>
</tbody>
</table>
</body>
这是我的数据库文件的图片: nim_finder
我试过:
- 将 ng-model 从“关键字”更改为“数据”
- 更改目录定义(添加“/”)
- 数据库连接肯定是正确的
- 我不明白脚本如何更有效地显示结果
最佳答案
关于php - 使用 angular js 对 php 和 mysql 进行实时搜索，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/43671924/