如何将所选选项设置为在Javascript中选择的默认值

时间:2016-06-02 03:56:38

标签: javascript jquery forms select materialize

我选择了物化样式的选项,在选择选项中我想检查数据库中是否存在选项值。

HTML代码:

<div class="row margin">
   <div id="input-select" class="section">
       <label>Supir</label>
          <select name="id_personalia" id="id_personalia" onchange="cek_supir()">
              <option id="default_supir" value="default_supir" disabled selected>pilih supir</option>
               <?php
                 foreach ($supir as $s) {
                ?>
                 <option value="<?= $s->id_personalia; ?>"> <?= $s->nama_ktp . " " . $s->id_personalia; ?> </option>
                <?php
                }
                ?>
          </select>
     </div>
</div>

JavaScript代码:

<script>
function cek_supir() {
    var supir = document.getElementById("id_personalia").value;
    var data = <?php echo json_encode($stat_supir) ?>;

    for (var i = 0; i < data.length; i++) {
        if (supir == data[i]) {
            $("#id_personalia").val('default_supir');
            Materialize.toast('Supir sedang bertugas', 3500);
            //document.getElementById("default_supir").selected = true;
            //document.getElementById("id_personalia").selected = false;
        }
    }
}

问题是选择选项无法设置所选选项。

1 个答案:

答案 0 :(得分:0)

实体化选择会覆盖浏览器默认值,因此当您更改select元素中的值时,需要使用.material_select()更新组件:

function cek_supir() {
    var supir = document.getElementById("id_personalia").value;
    var data = <?php echo json_encode($stat_supir) ?>;

    for (var i = 0; i < data.length; i++) {
        if (supir == data[i]) {
            $("#id_personalia").val('default_supir');
            $("#id_personalia").material_select();
            Materialize.toast('Supir sedang bertugas', 3500);
        }
    }
}

有关详细信息,请参阅docs