首页 > 解决方案 > Select2:创建新选项(标签)后删除一个类

问题描述

我有一个名为“jenis”的选择输入,使用 Select2 和一个隐藏的文本输入在一个带有 class="rmv"(display: none;在 mystyle.css 中)的 div 元素中,这使得“kdaset”输入隐藏。但是,如果用户为新项目类型创建了新选项(标签),则 kdaset 输入将再次可见。当标签或“动态选项创建”在选择中创建新选项时,如何删除 div 元素中的类?

这是我的代码

<form action="<?= site_url('aset/insert') ?>" method="post">
  <?php foreach ($setting as $s) {?>
    <div class="card-body">
      <div class="row">
        <div class="col-lg-8 mb-3">
           <div class="form-group">
              <label>Jenis barang <code>*</code></label>
              <select class="form-control select2 jenis" style="width: 100%;" name="jenis" id="jns">
                 <option></option>
                 <?php foreach ($jns as $j) {?>
                 <option><?= $j->jns_aset?></option>
                 <?php }?>
              </select>
           </div>
        </div>
        <div class="col-lg-4 mb-3 mr-4 rmv" id="kdaset"> <!-- I want to remove rmv class after user create new option in "jenis" dropdown -->
          <div class="form-group">
             <label>Kode jenis barang <code>*</code></label>
             <input name="kdaset" type="text" class="form-control" placeholder="contoh : HDPH">
          </div>
        </div>
      </div>
      <!-- /.row -->
    </div>
    <!-- /.card-body -->
    <div class="card-footer">
      <div class="row">
         <div class="col-lg-12">
            <a class="btn btn-danger ml-4" href="<?= site_url('home') ?>"><i class="fa fa-times"></i> Kembali</a>
            <button type="submit" class="btn btn-primary float-right mr-4"><i class="fa fa-check"></i> Simpan</button>
         <div>
      </div>
    </div>
  <?php }?>
</form>

<script>
$(function () {
  bsCustomFileInput.init();

  //Initialize Select2 Elements
  $('.select2').select2()
});

$(".jenis").on('select2:open', () => {
    document.querySelector('.select2-search__field').focus();
});

$(".jenis").select2({
  tags: true,
  placeholder: "Select a state"
});

$(".kondisi").select2({
    minimumResultsForSearch: Infinity,
    placeholder: "Select a state"
});
</script>

附加信息

模板:AdminLTE 3.1.0

php:7.4

标签: jquery-select2adminlte

解决方案


推荐阅读