简体   繁体   English

Selectpicker不适用于下拉列表更改

[英]Selectpicker is not working on dropdown change

I have two dropdown one for country and another for state. 我有两个下拉列表用于国家,另一个用于州。 i want state appears according to country. 我希望国家根据国家出现。 i add selectpicker class to both of the dropdown. 我将selectpicker类添加到两个下拉列表中。 but when i change the country in console it display error 但是当我在控制台中更改国家时,它显示错误

Error 错误

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

My Code 我的守则

My Html 我的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 使用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');
                }
            });
        }

Check that the library 'bootstrap-select.js' is loaded before using it: 在使用之前检查库'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>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM