Autocomplete Controller
class autocomplete extends CI_Controller{
function __construct() {
parent::__construct();
$this->load->model('mautocomplete');
}
public function index(){
$this->load->view('view_demo');
}
public function GetCountryName(){
$keyword=$this->input->post('keyword');
$data=$this->mautocomplete->GetRow($keyword);
echo json_encode($data);
}
}
Autocomplete Model
class Mautocomplete extends CI_Model{
public function GetRow($keyword) {
$this->db->order_by('id', 'DESC');
$this->db->like("name", $keyword);
return $this->db->get('autocomplete')->result_array();
}
}
Autocomplete View
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css">
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="<?php echo base_url(); ?>assets/custom.js"></script>
</head>
<body style="background-color: #D0D0D0;">
<div class="row">
<div class="col-md-4 col-md-offset-4" style="margin-top: 200px;">
<label class="control-lable">Country Name</label>
<input type="text" id="country" autocomplete="off" name="country" class="form-control" placeholder="Start typing and see the magic! :P">
<ul class="dropdown-menu txtcountry" style="margin-left:15px;margin-right:0px;" role="menu" aria-labelledby="dropdownMenu" id="DropdownCountry">
</ul>
</div>
</div>
</body>
</html>
Autocomplete Custom.js
$(document).ready(function () {
$("#country").keyup(function () {
$.ajax({
type: "POST",
url: "http://localhost/autocomplete/autocomplete/GetCountryName",
data: {
keyword: $("#country").val()
},
dataType: "json",
success: function (data) {
if (data.length > 0) {
$('#DropdownCountry').empty();
$('#country').attr("data-toggle", "dropdown");
$('#DropdownCountry').dropdown('toggle');
}
else if (data.length == 0) {
$('#country').attr("data-toggle", "");
}
$.each(data, function (key,value) {
if (data.length >= 0)
$('#DropdownCountry').append('<li role="presentation" ><a class="dropdownlivalue">' + value['name'] + '</a></li>');
});
}
});
});
$('ul.txtcountry').on('click', 'li a', function () {
$('#country').val($(this).text());
});
});
1 Comment
Rathna Kumar · June 28, 2016 at 6:15 pm
Hello Sushant Vishwas,
How to edit or add custom menu in account tab. (Right top in magento 1.9).