Today, We want to share with you codeigniter autocomplete from database.In this post we will show you ajax search in codeigniter demo, hear for jquery ui autocomplete in codeigniter with database we will give you demo and example for implement.In this post, we will learn about CodeIgniter Autocomplete Multiple Input Textbox With Database with an example.
PHP Codeigniter 3 – Jquery Ajax Autocomplete Search using Typeahead
Contents
Step 1: Create Table
tags table
CREATE TABLE IF NOT EXISTS `tags` ( `id` int(10) unsigned NOT NULL AUTO_INCREMENT, `slug` varchar(255) COLLATE utf8_unicode_ci NOT NULL, `name` varchar(255) COLLATE utf8_unicode_ci NOT NULL, `meta_keyword` text COLLATE utf8_unicode_ci NOT NULL, `meta_description` text COLLATE utf8_unicode_ci NOT NULL, `created_at` timestamp NOT NULL DEFAULT '0000-00-00 00:00:00', `updated_at` timestamp NOT NULL DEFAULT '0000-00-00 00:00:00', PRIMARY KEY (`id`) ) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_unicode_ci AUTO_INCREMENT=533 ;
Step 2: Make database configuration
application/config/database.php
<?php defined('BASEPATH') OR exit('No direct script access allowed'); $active_group = 'default'; $query_builder = TRUE; $db['default'] = array( 'dsn' => '', 'hostname' => 'localhost', 'username' => 'main8754_988', 'password' => '@#hjdfjhf$$%^&&**%^^', 'database' => 'pakainfo', 'dbdriver' => 'mysqli', 'dbprefix' => '', 'pconnect' => FALSE, 'db_debug' => (ENVIRONMENT !== 'production'), 'cache_on' => FALSE, 'cachedir' => '', 'char_set' => 'utf8', 'dbcollat' => 'utf8_general_ci', 'swap_pre' => '', 'encrypt' => FALSE, 'compress' => FALSE, 'stricton' => FALSE, 'failover' => array(), 'save_queries' => TRUE );
Step 3: Add Route
application/config/routes.php
$route['default_controller'] = 'welcome'; $route['404_override'] = ''; $route['translate_uri_dashes'] = FALSE; $route['ajax-view'] = 'welcome/index'; $route['ajaxpro'] = 'welcome/dashBoard';
Step 4: Create Controller
application/controllers/Welcome.php
<?php defined('BASEPATH') OR exit('No direct script access allowed'); class Welcome extends CI_Controller { /** * Constructor of Controller * * @return Response */ public function __construct() { parent::__construct(); $this->load->database(); } /** * Create from display view * * @return Response */ public function index() { $this->load->view('profiles'); } /** * response of ajax json * * @return Response */ public function dashBoard() { $query = $this->input->get('query'); $this->db->like('name', $query); $data = $this->db->get("tags")->result(); echo json_encode( $data); } }
Step 5: Create View File
application/views/profiles.php
<html lang="en"> <head> <title>Codeigniter 3 - jquery ajax autocomplete search using typeahead example- www.pakainfo.com</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.min.css" /> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-3-typeahead/4.0.1/bootstrap3-typeahead.min.js"></script> </head> <body> <div class="container"> <h1>Codeigniter 3 - jquery ajax autocomplete search using typeahead example- www.pakainfo.com</h1> <input class="typeahead form-control" type="text"> </div> <script type="text/javascript"> $('input.typeahead').typeahead({ source: function (query, process) { return $.get('/ajaxpro', { query: query }, function (data) { console.log(data); data = $.parseJSON(data); return process(data); }); } }); </script> </body> </html>
I hope you get an idea about Autocomplete in Codeigniter using Typeahead.
I would like to have feedback on my infinityknow.com blog.
Your valuable feedback, question, or comments about this article are always welcome.
If you enjoyed and liked this post, donโt forget to share.
I am Jaydeep Gondaliya , a software engineer, the founder and the person running Pakainfo. I’m a full-stack developer, entrepreneur and owner of Pakainfo.com. I live in India and I love to write tutorials and tips that can help to other artisan, a Passionate Blogger, who love to share the informative content on PHP, JavaScript, jQuery, Laravel, CodeIgniter, VueJS, AngularJS and Bootstrap from the early stage.