How to handle large data in drop down with search box bootstrap - php

Question

I have one bootstrap drop down with search text box in my web page. I am adding dynamic data into that drop down, but they are large and come from a database. That why it takes long to load. Does anyone know the solution for this problem?
<select data-live-search="true" name="paymentfacility" id="paymentfacility" data-live-search-style="startsWith" class="selectpicker">
<?php
foreach($facilitiesall as $val)
{?>
<option value="<?php echo $val['Facility']['id']; ?>">
<?php echo $val['Facility']['name']; ?>
</option>
<?php } ?>
</select>

Answer 1

If you don't mind to change select field into an input text field, I use this script: it's an autocomplete library that create a list just below the input field. It calls a php file searching what I'm looking for, so you don't load all DB..
https://github.com/jhonis/bootcomplete
JS
$('#inputText').bootcomplete({
url: 'search.php',
method: 'post',
minLength: 2
});
PHP
$txt = $_POST['query'];
$helper = new PDO(CONNECTION_DNS, CONNECTION_USER, CONNECTION_PWD);
$helper->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
// YOU MUST HAVE id AND label AS RETURN DATA
$stmt = $helper->prepare('SELECT P.Id as id, P.Code as label FROM TABLE_NAME WHERE Code LIKE :Query');
$stmt->bindValue(':Query', '%'.$txt.'%', PDO::PARAM_STR);
$stmt->execute();
$results = $stmt->fetchAll(PDO::FETCH_ASSOC);
print json_encode($results);