无法设置模态内部元素的tabindex

时间:2018-03-08 05:18:00

标签: html css laravel-5.2 tabindex

我想在我的模态中设置选择选项和加号(fa-plus)的tabindex。我试过tabindex =" 1"。问题是select会收到焦点,但是我无法为选项vales键入任何内容。此外,加号,没有任何焦点。

以下是我的代码:

 <div class="modal fade" id="matnr_name_modal" tabindex="-1" role="dialog" >
    <div class="modal-dialog modal-md" role="document">
        <div class="">
            <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" >Material Name</h4>-->
                     <div class=" form-group required col-md-12 pull-right" >
                        <div class="col-md-2 nopadding">{!!Form::label('type', 'Category');!!}</div>

                        <div class="col-md-6">
                            <select class="form-control nopadding select2 type " id="type" name="type">
                                <option value="">Select Type</option>

                            </select>
                        </div>
                        <div class="col-md-1 nopadding">
                            <a class="" style="color: green;" target="_blank" href="<?php echo url('add_category');?>"><i class="fa fa-plus fa-2x" aria-hidden="true"></i></a>
                        </div>
                    </div>
                </div>

                <div class="modal-body"  style="height: 300px;overflow-y: scroll;">


                </div>
                <div class="modal-footer">
                    <p class="pull-left">Code:-<strong><span class="ccode"></span></strong></p>
                    <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                    <button type="button" class="btn btn-primary create_name">Create</button>
                </div>

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

1 个答案:

答案 0 :(得分:0)

很高兴看到这个在codepen中工作。 但从它的外观来看,我认为你在选择框中使用select 2插件进行预先输入功能。 由于插件隐藏了选择框并用自定义ui替换它,因此您需要以编程方式访问才能触发它以便在焦点上打开。