我创建了这个在我的mysql数据库中搜索的自动完成搜索。 这是我的代码:
<div class="search-bar">
<div class="ui-widget">
<input id="skills" class="search1" placeholder="Cerca un tipo di marca">
<input type="submit" value="">
</div>
</div>
&#13;
这是数据库连接:
<?php
$dbHost='localhost';
$dbUsername='root';
$dbPassword='evolvia2016';
$dbName='codexworld';
$db=new mysqli($dbHost,$dbUsername,$dbPassword,$dbName);
//get search term
$searchTerm=$_GET['term'];
//get matched data from skills table
$query=$db->query("SELECT * FROM skills WHERE skill LIKE '%".$searchTerm."%' ORDER BY skill ASC");
while ($row = $query->fetch_assoc()) {
$data[] = $row['skill'];
}
//return json data
echo json_encode($data);
?>
问题是提交按钮或搜索图标(缩放)没有出现在这里。我创建了这个:
<input type="submit" value="">
输出搜索图标,但除了文本框效果良好之外没有其他内容。因此除了搜索图标外,自动完成功能正常。有人可以帮助我吗?我的代码中有错误吗?谢谢!
答案 0 :(得分:0)
带有搜索图标的代码段,而非输入类型=“提交”,然后使用按钮进行样式化。
<html>
<head>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" type="text/css" rel="stylesheet">
<script data-require="bootstrap@*" data-semver="4.0.0-alpha.2" src="https://cdn.rawgit.com/twbs/bootstrap/v4-dev/dist/js/bootstrap.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body>
<div class="container">
<div class="row">
<div id="custom-search-input">
<div class="input-group col-md-12">
<input type="text" class=" search-query form-control" placeholder="Search" />
<span class="input-group-btn">
<button class="btn btn-danger" type="button">
<span class=" glyphicon glyphicon-search"></span>
</button>
</span>
</div>
</div>
</div>
</div>
</body>
</html>