Question

我有两个下拉列表用于国家，另一个用于州。我希望国家根据国家出现。我将selectpicker类添加到两个下拉列表中。但是当我在控制台中更改国家/地区时显示错误

错误

TypeError: $(...).selectpicker is not a function
return c.join(',');

我的代码

我的Html

 <select data-size="5" onchange="changeCountry(this.value)" class="form-control selectpicker bs-select-hidden" name="Tours[countryid]" id="Tours_countryid">
<option>Country1</option>
    <option>Country2</option>
    </select>

<select id="Tours_stateid" name="Tours[stateid]" data-size="5" class="form-control selectpicker bs-select-hidden" maxlength="50">
<option value="">---Select State---</option>
</select>

的Javascript

<script src="bootstrap-select.js"></script>
$(document).ready(function()
    {
 $(".selectpicker").selectpicker(); 
});


function changeCountry(value)
        {
            $.ajax({
                url: "<?php echo Yii::app()->createurl('/site/changecountry') ?>",
                type: 'post',
                data: {id: value},
                success: function (result) {
                    $("#Tours_stateid").html(result)
                    $('.selectpicker').selectpicker('refresh');
                }
            });
        }

Answer 1

在使用之前检查库'bootstrap-select.js'是否已加载：

<!DOCTYPE html>
<html>
  <head>
...
    <!-- Loading library -->
    <script src="bootstrap-select.js"></script>

    <!-- Using library -->
    <script type="text/javascript">
       $(document).ready(function()
       {
         $(".selectpicker").selectpicker(); 
       });
    </script>

  </head>

  <body>
    <select data-size="5" onchange="changeCountry(this.value)" class="form-control selectpicker bs-select-hidden" name="Tours[countryid]" id="Tours_countryid">
      <option>Country1</option>
      <option>Country2</option>
    </select>

    <select id="Tours_stateid" name="Tours[stateid]" data-size="5" class="form-control selectpicker bs-select-hidden" maxlength="50">
      <option value="">---Select State---</option>
    </select>
  </body>
</html>

Selectpicker不会处理下拉列表更改

1 个答案: