如何在弹出对话框中调用函数JavaScript?

时间:2016-01-20 03:17:03

标签: javascript jquery html

我有select标记:

<select id="categoryID" onchange="changeCategory(this)" class="form-control select2" style="width: 100%">
  @foreach($category as $item)                                            
    <option id="{{$item->id}}">{{$item->name}}</option>;
  @endforeach
</select>
<script>
    function initialSelect() {
        $(".select2").select2();
    }
    $(function () {
        //Initialize Select2 Elements
        $(".select2").select2();
    });
</script>

此代码将显示:enter image description here

然后在点击按钮时弹出此对话框时将其置于对话框中:

<button onclick="typeAdd()" class="btn btn-block btn-primary" data-toggle="modal"
                                data-target="#addNewCategoryModal">New
</button>

<div class="modal fade" id="addNewCategoryModal" tabindex="-1" role="dialog">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                                aria-hidden="true">&times;</span>
        </button>
        <h4 class="modal-title" id="titleLabel">New Category</h4>
     </div>
     <div class="modal-body">
       <div class="form-group">
         <select id="categoryID" onchange="changeCategory(this)" class="form-control select2" style="width: 100%">
           @foreach($category as $item)                                            
             <option id="{{$item->id}}">{{$item->name}}</option>;
           @endforeach
        </select>
     </div>
   </div>
</div>
<script>
    function initialSelect() {
        $(".select2").select2();
    }
    $(function () {
        //Initialize Select2 Elements
        $(".select2").select2();
    });
</script>

但是当弹出对话框时,select标记会显示但不能输入(在input标记中搜索)。 enter image description here

我认为原因是$(".select2").select2();,因此我尝试在显示对话框时设置此行:

$('#addNewCategoryModal').on('show.bs.modal', function (event) {
        var modal = $(this)
        initialSelect();
        modal.find('.modal-body #category_id').val(categoryID)
        modal.find('.modal-body #type').val(type)
        //this
        modal.find('.modal-body #categoryID').select2();
        modal.find('.modal-body categoryID').select2();
        modal.find('.select2').select2();
        $(".select2").select2();
    })

它不起作用,请帮忙。感谢。

0 个答案:

没有答案