CODEWITHSUNDEEP
phptwitter-bootstrap
user3312884
user3312884

Reputation: 97

Bootstrap select with search not working in php

Bootstrap select search is not working.May be there is small thing i am missing. I have using bootstrap select which is working fine.Select options coming from database.added data-live-search="true" for search which is not working.Select dropdown not opening.

Code is

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" >
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.6.3/css/bootstrap-select.min.css" />
  <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.6.3/js/bootstrap-select.min.js"></script>


<?php $sql = "select * from vehicle order by vehiclename";
$vehicle_list = $mysqli->query($sql);

$schematron_array['Level5'] == coming from different table ?>

<label>Vehicle</label>
<select class="selectpicker form-control" data-live-search="true" name="vehicle">
    <option value="">Select vehicle</option>
    <?php while( $row = $vehicle_list->fetch_array() ) { 
        if(!empty($row['vehiclename'])) {?>
        <option value="<?php echo $row['vehiclename']; ?>" <?php echo ($schematron_array['Level5'] == $row['vehiclename'])?"selected":""; ?> >
        <?php echo $row['vehiclename']; ?>
        </option>
        <?php } } ?>
</select>

Thanks. Please Forgive if any mistake is there.

Upvotes: 0

Views: 2645

Answers (1)

Rudraksh Pathak
Rudraksh Pathak

Reputation: 898

There can be two issues - 1. jQuery is missing. 2. Database not returning any rows.

I used your code, applied jQuery and supplied some hard-coded values and it is working fine.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>

  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.6.3/css/bootstrap-select.min.css" />
  <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.6.3/js/bootstrap-select.min.js"></script>



<label>Vehicle</label>
<select class="selectpicker form-control" data-live-search="true" name="vehicle">
    <option value="">Select vehicle</option>
    <option value="">Vehicle 1</option>
    <option value="">Vehicle 2</option>
    <option value="">Vehicle 3</option>
    <option value="">Vehicle 4</option>
    <option value="">Vehicle 5</option>
</select>

Upvotes: 1

Related Questions