centered" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="exampleModalCenterTitle">担当者確認画面</h5> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">×</span> </button> </div> <div class="modal-body"> <p>こちらの担当者であっていますか?</p> <p>ITソリューション部:山田</p> </div> <div class="modal-footer"> <a href="" type="button" class="btn btn-secondary" data-dismiss="modal">キャンセル</a> <a type="submit" class="btn btn-primary">OK</a> </div> </div> </div> </div>-->

                        </div>

                    </form>

                </div>

            </div>
        </div>
    </div>

</div>

<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script
    src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script
    src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script
    src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
<script
    src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.4.1/js/bootstrap.min.js"></script>
<script
    src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>

<script
    src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script
    src="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.8.7/chosen.jquery.min.js"></script>
<link
    href="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.8.7/chosen.min.css"
    rel="stylesheet">

<script>
    $('.chosen-select').chosen({
        search_contains : true
    });

    $(function() {
        var searchBox = '.search-box'; // 絞り込む項目を選択するエリア
        var listItem = '.list_item'; // 絞り込み対象のアイテム
        var hideClass = 'is-hide'; // 絞り込み対象外の場合に付与されるclass名
        $(function() {
            // 絞り込み項目を変更した時
            $(document).on('change', '.search-box select', function() {
                search_filter();

                $('.chosen-select').trigger("chosen:updated"); // 追加
            });
        });

        //リストの絞り込みを行う
        function search_filter() {
            // 非表示状態を解除
            // $(listItem).removeClass(hideClass);
            $(listItem).attr('disabled', false);
            for (var i = 0; i < $('.search-box select').length; i++) {
                var name = $('.search-box select').eq(i).attr('name');
                // 選択されている項目を取得
                var searchData = get_selected_input_items(name);
                // 選択されている項目がない、またはALLを選択している場合は飛ばす
                if (searchData.length === 0 || searchData[0] === '') {
                    continue;
                }

                // リスト内の各アイテムをチェック
                for (var j = 0; j < $(listItem).length; j++) {
                    // アイテムに設定している項目を取得
                    var itemData = $(listItem).eq(j).data(name);
                    // 絞り込み対象かどうかを調べる
                    if (searchData.indexOf(itemData) === -1) {
                        //$(listItem).eq(j).addClass(hideClass);
                        $(listItem).eq(j).attr('disabled', true);
                    }
                }
            }
        }
        //選択されているoptionのvalue属性の値
        function get_selected_input_items(name) {
            var searchData = [];
            // $('[name=' + name + ']:checked').each(function() {
            $('select[name=' + name + '] option:selected').each(
                    function() {
                        searchData
                                .push($(
                                        'select[name=' + name
                                                + '] option:selected')
                                        .val());
                    });
            return searchData;
        }
    });

</script>

</body>

</html>