Json 选择器选择器的sintax出现问题（“刷新”）

我尝试用json文件中的数据填充select表单

[{"matricola":"1", "nome":"aaaaa"},{"matricola":"2", "nome":"bbbbbb"}]

如果我使用select，它会工作，如果我尝试使用selectpicker，我不知道在我的javascript代码中哪里需要刷新selectpicker

这是我的代码：

<div class="form-group  ">
<select id="cf" class="selectpicker show-tick form-control" data-dropup-auto="false" data-live-search="true" required="" name="cf">
</select>
</div> 

<script>            
let dropdown = document.getElementById('cf');
dropdown.length = 0;

let defaultOption = document.createElement('option');
defaultOption.text = 'Seleziona un dipendente';

dropdown.add(defaultOption);
dropdown.selectedIndex = 0;

const url = 'tables/griglia_dipendenti_incarichi.php';

const request = new XMLHttpRequest();
request.open('GET', url, true);

request.onload = function() {
  if (request.status === 200) {
    const data = JSON.parse(request.responseText);
    let option;
    for (let i = 0; i < data.length; i++) {
      option = document.createElement('option');
      option.text = data[i].nome;
      option.value = data[i].matricola;
      if (i==0){
        alert(option.text);
      }
      dropdown.add(option);
    }
   } else {
    // Reached the server, but it returned an error
  }   
}

request.onerror = function() {
  console.error('An error occurred fetching the JSON from ' + url);
};

request.send();
</script> 

---

但是它不起作用

首先，您应该阅读本指南，并检查是否已将所有需要的文件链接到该页面。 下一步是初始化引导选择插件。您可以对页面上的所有select标记执行此操作：

$('select').selectpicker();

或者仅针对您的元素：

$('#cf').selectpicker();

现在，如果您更改了任何select并希望用户看到更改，则需要刷新selectpicker插件。 如果使用新版本的引导选择插件，请尝试以下操作：

$('#cf').selectpicker('refresh');

否则，请使用以下命令：

$('#cf').selectpicker('destroy');
$('#cf').selectpicker();  

---

p、 美国：这里有一个简单的例子-

非常感谢。它使用假数据，而不是在线json

下面是我的javascript代码：

<script>
$('#cf').selectpicker();
var Request = function () {

    let dropdown = document.getElementById('cf');
    dropdown.length = 0;

    let defaultOption = document.createElement('option');
    defaultOption.text = 'Seleziona un dipendente';

    dropdown.add(defaultOption);
    dropdown.selectedIndex = 0;

    // data
    const url = 'tables/griglia_dipendenti_incarichi.php';

    const request = new XMLHttpRequest();
    request.open('GET', url, true);

    request.onload = function() {
      if (request.status === 200) {
        const data = JSON.parse(request.responseText);
        for (let i = 0; i < data.length; i++) {
            let option;
            option = document.createElement('option');
            option.text = data[i].nome;
            option.value = data[i].matricola;
            /*if (i==0){
                alert(option.text);
            }*/
            dropdown.add(option);
        }

       } else {
        // Reached the server, but it returned an error
      }   
    }

    request.onerror = function() {
      console.error('An error occurred fetching the JSON from ' + url);
    };

    request.send();

    //alert('request has been sent!');

    // here we refresh selectpicker plugin
    //$('#cf').selectpicker('refresh');
    // OR destroy and initialize it IF "refresh" didn't work
    $('#cf').selectpicker('destroy');
    $('#cf').selectpicker();    

};

Request();

</script>

我最后一个错误在哪里

<script>
$('#cf').selectpicker();
var Request = function () {

    let dropdown = document.getElementById('cf');
    dropdown.length = 0;

    let defaultOption = document.createElement('option');
    defaultOption.text = 'Seleziona un dipendente';

    dropdown.add(defaultOption);
    dropdown.selectedIndex = 0;

    // data
    const url = 'tables/griglia_dipendenti_incarichi.php';

    const request = new XMLHttpRequest();
    request.open('GET', url, true);

    request.onload = function() {
      if (request.status === 200) {
        const data = JSON.parse(request.responseText);
        for (let i = 0; i < data.length; i++) {
            let option;
            option = document.createElement('option');
            option.text = data[i].nome;
            option.value = data[i].matricola;
            /*if (i==0){
                alert(option.text);
            }*/
            dropdown.add(option);
        }

       } else {
        // Reached the server, but it returned an error
      }   
    }

    request.onerror = function() {
      console.error('An error occurred fetching the JSON from ' + url);
    };

    request.send();

    //alert('request has been sent!');

    // here we refresh selectpicker plugin
    //$('#cf').selectpicker('refresh');
    // OR destroy and initialize it IF "refresh" didn't work
    $('#cf').selectpicker('destroy');
    $('#cf').selectpicker();    

};

Request();

</script>