输入字段来缩小搜索结果不工作

我对我的website.I的数据筛选工作正在实施基于相互关联的下拉过滤器的AJAX。输入字段来缩小搜索结果不工作

用于例如：在第一个下拉菜单中用户需要选择国家，然后在第二个下拉状态将被填充，并选择将在第三下拉列表填充状态城市名单后。

所以我主要关心的是，我也想给下拉列表中搜索工具来缩小搜索类似图像。

这里是我的代码：
HTML

<select name="country" id="country"> 
    <option>select country</option> 

<?php 
    $sql = "SELECT * from plus2_country ORDER BY country ASC"; 
    $result = mysqli_query($conn,$sql) or die(mysqli_error($conn)); 
    $row_count = mysqli_num_rows($result); 
    if($row_count > 0) 
    { 
     while($row = mysqli_fetch_array($result)) 
     { 
      echo '<option value="'.$row['country_code'].'">'.$row['country'].'</option>'; 
     } 
    } 
    else 
    { 
     '<option value="">Country not available</option>'; 
    } 
?>

JQUERY

$(document).ready(function(){ 
$('#country').on('change',function(){ 
    var country_code = $(this).val(); 
    console.log(country_code); 
    if(country_code){ 
     $.ajax({ 
      type:'POST', 
      url:'dependent.php', 
      data:'country_code='+country_code, 
      success:function(html){ 
       console.log(html); 
       $('#state').html(html); 
       $('#city').html('<option value="">Select state first</option>'); 

      } 
     }); 
    }else{ 
     $('#state').html('<option value="">Select country first</option>'); 
     $('#city').html('<option value="">Select state first</option>'); 
    } 
});

只要帮我实现dropdown.Thanks文本框过滤提前

来源

2016-07-25 parvez

$('.dropdown-menu input').click(function (e) { 
e.stopPropagation(); 
}); 
$('.dropdown-menu li').click(function(){ 

$('.dropdown-toggle b').remove().appendTo($('.dropdown- toggle').text($(this).text())); 
});

Demo

来源

2016-07-25 12:57:47 Ranjan

如果你知道angularjs，你可以很容易地通过https://material.angularjs.org/latest/demo

做到这一点的话，使用此代码：

<md-input-container class="md-block" flex="60"> 
<label>state</label> 
<md-select ng-model="selectedState" name="State" md-on-close="clearSearchState()" required> 
<md-select-header> 
     <input ng-model="searchState" type="search" placeholder="search..."> 
</md-select-header> 
<md-optgroup label="stateItem"> 
<md-option ng-value="stateItem" ng-repeat="stateItem in states | filter:searchState">{{stateItem.State}}</md-option> 
    </md-optgroup> 
</md-select> 
<div ng-messages="addBranch.City.$error"> 
     <div ng-message="required">please feel the input</div> 
</div>

和控制器定义：

$scope.states=[{"State":"state1","ID":"1"},{"State":"state2","ID":"2"}]; 
$scope.searchState; 
$scope.clearSearchState = function() {$scope.searchState = '';}; 
$element.find('input').on('keydown', function(ev) {ev.stopPropagation();});

来源

2016-12-18 15:42:33 Siron

输入字段来缩小搜索结果不工作

回答

相关问题