Ich benutze Bootstrap, um ein Modal zum Übermitteln der Client-Informationen zu erstellen. Aber ich finde das Bootstrap Modal Drop-Down ist hinter dem Modal versteckt. Ich suche einige Dokumentationen, aber keine von ihnen funktioniert. Ich benutze backbonejs, um das <span>
zu erstellen, und es ruft den Ajax auf, um alle Zustandsnamen von API zu erhalten. Aber es sollte ein Dropdown-Menü anzeigen. Hier ist der Hauptcode:Das Boostrap Modal Drop-Down ist hinter dem Modal versteckt
<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">×</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-Helfer-versteckt-accessible" eine Klasse I erstellt:
.ui-helper-hidden-accessible {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
Dank
Sie haben Recht, Hinzufügen von Z-Index funktioniert für mich. –