<p><strong>Membuat AutoComplete Dengan PHP, Ajax dan MySQL &#8211;</strong> Pada tutorial kali ini saya akan memberikan tutorial tentang cara membuat autocomplete dengan php, ajax dan mysql.</p>
<p>Apa itu autocomplete?</p>
<p>Pernahkah anda melakukan pencarian di google, lalu dengan menggetikkan permulaan keyword yang ingin anda cari maka google akan memberikan &#8216;suggestion keyword&#8217; (saran kata kunci) yang ingin anda cari dan anda bisa langsung memilihnya, nah itu adalah salah satu contoh dari autocomplete yang akan kita pelajari pada tutorial ini.</p>
<div class="bacajuga">
<div class="titlebaca"><strong>Baca Juga:</strong></div>
<div class="contentbaca">
<ul>
<li><a href="https://www.tutorialpedia.net/membuat-aplikasi-crud-sederhana-dengan-php-dan-mysql/">Membuat Aplikasi CRUD Sederhana dengan PHP dan MySQL</a></li>
<li><a href="https://www.tutorialpedia.net/membuat-database-baru-di-postgresql/">Membuat Database Baru di PostgreSQL</a></li>
<li><a href="https://www.tutorialpedia.net/perintah-update-data-di-database/">Perintah Update Data di Database PostgreSQL</a></li>
</ul>
</div>
</div>
<div class="partner-banner-aftc-baca-juga" style="text-align: center; margin-top: 30px;"></div>
<p>Lalu, bagaimana cara membuat autocomplete dengan php?</p>
<p>Berikut ini akan saya berikan tutorial tentang membuat autocomplete dengan php.</p>
<h3><strong>Membuat AutoComplete Dengan PHP, Ajax dan MySQL</strong></h3>
<ol>
<li>Buat database terlebih dahulu, kali ini saya tidak saya jelaskan secara mendetil tentang bagaimana cara membuat database dan table baru pada mysql. Untuk mempermudah anda bisa dumping query sql berikut:
<pre class="lang:default decode:true ">-- 
-- Table structure for table `autocomplete` 
-- 
 
CREATE TABLE IF NOT EXISTS `autocomplete` ( 
 `id` int(100) NOT NULL, 
 `title` varchar(100) NOT NULL, 
 `url` varchar(100) NOT NULL 
) ENGINE=InnoDB AUTO_INCREMENT=7 DEFAULT CHARSET=latin1; 
 
-- 
-- Dumping data for table `autocomplete` 
-- 
 
INSERT INTO `autocomplete` (`id`, `title`, `url`) VALUES 
(1, 'How to create preloader using CSS &; Jquery', 'http://www.webidea4u.com/create-preloader-using-css-jquery/'), 
(2, 'Login with Google Account using PHP &; Mysql', 'http://www.webidea4u.com/login-google-account-using-php-mysql/'), 
(3, 'Login with Facebook using PHP &; Mysql', 'http://www.webidea4u.com/login-facebook-using-php-mysql/'), 
(4, 'Export to Excel using PHP &; Mysql', 'http://www.webidea4u.com/export-excel-using-php-mysql/'), 
(5, 'Login and Registration in PHP and Mysql', 'http://www.webidea4u.com/login-registration-php-mysql/'), 
(6, 'How to create bootstrap form validation', 'http://www.webidea4u.com/how-to-create-bootstrap-form-validation/');</pre>
<p> ;</li>
<li>setelah membuat database, kemudian kita akan membuat form yang akan digunakan untuk melakukan pencarian data autocomplate dengan teknik ajax, silahkan buat sebuah file baru dengan nama index.php dan tulislah script berikut :
<pre class="lang:default decode:true "><;!doctype html>; 
<;html lang="en">; 
<;head>; 
 <;meta charset="utf-8">; 
 <;title>;TutorialPedia.net | Autocomplete search using PHP Mysql Jquery and Ajax<;/title>; 
 <;link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">; 
 <;script src="http://code.jquery.com/jquery-1.10.2.js">;<;/script>; 
 <;script src="http://code.jquery.com/ui/1.11.4/jquery-ui.js">;<;/script>; 
 <;link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">; 
 <;script type="text/javascript" src="js/bootstrap.min.js">;<;/script>; 
 <;script>; 
 $(function() { 
 $( "#skills" ).autocomplete({ 
 source: 'autocomplete_search.php' 
 }); 
 }); 
 <;/script>; 
<;/head>; 
<;body>; 
<;div class="container">; 
 <;h2>;Autocomplete search using PHP Mysql Jquery and Ajax<;/h2>; 
 <;label for="skills" class="control-label">;Skills: <;/label>; 
 <;input id="skills" class="form-control" placeholder="Enter your skills like PHP, Mysql, Jquery, Ajax">; 
<;/div>; 
<;/body>; 
<;/html>;</pre>
</li>
<li>sekarang kita akan membuat sebuah file baru dengan nama autocomplate_search.php, file ini nanti akan bertugas untuk menggenerate data json berdasarkan keyword yang dikirimkan oleh file utama dengan teknik ajax, silahkan ketik script berikut ini :
<pre class="lang:default decode:true "><;?php 
$host = 'localhost'; 
$username = 'root'; 
$pass = ''; 
$Dbname = 'test'; 
//connect with the database 
$db = new mysqli($host,$username,$pass,$Dbname); 
//get search term 
$searchTerm = $_GET['term']; 
//get matched data from skills table 
$query = $db->;query("SELECT * FROM autocomplete WHERE title LIKE '%".$searchTerm."%' ORDER BY id ASC"); 
while ($row = $query->;fetch_assoc()) { 
 $data[] = $row['title']; 
} 
//return json data 
echo json_encode($data); 
?>;</pre>
<p> ;</li>
</ol>
<p>Sekarang coba jalankan.</p>
<p>Itulah tutorial <strong>Membuat AutoComplete Dengan PHP, Ajax dan MySQL.</strong></p>
<p>sumber : belajarphp.net</p>

Membuat AutoComplete Dengan PHP, Ajax dan MySQL
Recent Articles
Kumpulan DNS Gratis Tercepat!
DNS merupakan sebuah sistem yang bertugas menyimpan semua informasi data domain dalam jaringan. Dengan adanya DNS, domain atau hostname yang ada akan ditranslate dan...
Apa itu DNS ? Dan Fungsinya
Apa itu DNS? - DNS (Domain Name System) adalah sebuah sistem yang bertugas menyimpan semua informasi data domain dalam jaringan. Dengan adanya DNS, domain...
Apa itu OLT ? Serta Fungsinya Dalam Jaringan
Apa itu olt ? OLT (Optical Line Termination) adalah perangkat keras yang berfungsi sebagai titik akhir (end-point) dari layanan jaringan optik pasif (Passive Optical...
Template Voucher Untuk Mixradius
Template Voucher Untuk Mixradius - Pasti kalian bosen kan dengan template voucher default mixradius? tenang. kali ini saya akan memberikan template untuk voucher mixradius kamu agar...
Daftar Port Game Online Mikrotik Terbaru
Daftar port game online dibawah ini bisa digunakan untuk membuat rule agar koneksi ke game online tersebut bisa lancar, bisa juga untuk memisahkan antara...
