html - Bootstrap Modal Dropdown 隐藏在 Modal 后面

Question

我正在使用 Bootstrap 创建用于提交客户信息的模式。但我发现 Bootstrap Modal Drop down 隐藏在模态后面。我搜索了一些文档，但没有一个有效。我正在使用 backbonejs 创建 <span>它将调用 ajax 从 API 获取所有状态名称。但它应该显示一个下拉菜单。以下是主要代码:

<div class="modal fade" id="clientinfoForm" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h2 class="modal-title" id="myModalLabel">Client Info</h2>
        </div>
        <div class="modal-body">
            <form id="InfoRequestForm" class="responsive-form" method="POST">
            //The Problem Codes here, it is a input field to let client
            //enter the state information and autocomplete through drop down menu
         <div class="col-sm-8 col-xs-6">
            <label>State*</label>
            <input name="state" id="state" type="text" class="large state" value="" />
            <span role="status" aria-live="polite" class="ui-helper-hidden-accessible">1 result is available, use up and down arrow keys to navigate.</span>
            <input type="hidden" class="stateId" value="" />
            <input id="stateName" type="hidden" value="" />
                            </div>

“ui-helper-hidden-accessible”是我创建的一个类:

  .ui-helper-hidden-accessible {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}

谢谢

Answer 1

在下拉列表中添加 Z 索引。