बूटस्ट्रैप मोडल के भीतर चुना गया ड्रॉपडाउन मोडल फ़ूटर

Question

के पीछे छिपा हुआ है, मैं ट्विटर बूटस्ट्रैप से उदाहरण के आधार पर एक मोडल का उपयोग कर रहा हूं। मेरे पास एक चुनिंदा तत्व है जो चुने गए का उपयोग करता है। जब चयनित चयन नीचे गिर जाता है, तो इसे मोडल पाद लेख द्वारा काट दिया जाता है। मैंने चुने हुए तत्वों पर जेड-इंडेक्स वैल्यू जोड़ने की कोशिश की, लेकिन कुछ भी काम नहीं करता है। मैं इसे झुकाव में देख रहा हूं, और आश्चर्यचकित हूं कि यह सिर्फ इसलिए है क्योंकि चयन तत्व divs के साथ है जो मोडल फ़ूटर div से पहले हैं? मैं इसके लिए चुने गए और बूटस्ट्रैप से डिफ़ॉल्ट सीएसएस का उपयोग कर रहा हूं, इसलिए मैंने कुछ भी संशोधित नहीं किया है।

उदाहरण।

HTML: z- सूचकांक काम करने के लिए

  <div class="modal-header"> 
       <button type="button" class="close" data-dismiss="modal" aria-hidden="true"> 
        ×</button> 
       <h3> 
        Add Tag</h3> 
      </div> 
      <div class="modal-body"> 
       <div class="control-group"> 
        <label for="addedTags"> 
         Add tags (separated by commas) 
        </label> 
        <input id="addedTags" style="width: inherit" type="text"> 
       </div> 
       <div class="control-group"> 
        <label for="deleteTags"> 
         Delete tags 
        </label> 
        <select style="display: none;" class="tags chzn-done" id="deleteTags" multiple="multiple" name="deleteTags"><option value="49">Accessories</option> 
    <option value="69">AG_Adriano_Goldschmied</option> 
    <option value="37">BCBG</option> 
    <option value="38">Bebe</option> 
    <option value="45">Bernie_Dexter</option> 
    <option value="19">Black</option> 
    <option value="6">Blue</option> 
    <option value="66">Body-Con</option> 
    <option value="71">Casual</option> 
    <option value="39">Christian_Louboutin</option> 
    <option value="64">Clear</option> 
    <option value="50">Coach</option> 
    </select><div style="width: [object Object]px;" class="chzn-container chzn-container-multi chzn-container-active" id="deleteTags_chzn"> 
<ul class="chzn-choices"><li class="search-field"><input value="Select Some Options" class="default" autocomplete="off" style="width: 149px;" type="text"></li></ul> 
<div class="chzn-drop" style="left: 0px; top: 29px;"><ul class="chzn-results"><li id="deleteTags_chzn_o_0" class="active-result highlighted" style="">Accessories</li><li id="deleteTags_chzn_o_1" class="active-result" style="">AG_Adriano_Goldschmied</li><li id="deleteTags_chzn_o_2" class="active-result" style="">BCBG</li><li id="deleteTags_chzn_o_3" class="active-result" style="">Bebe</li><li id="deleteTags_chzn_o_4" class="active-result" style="">Bernie_Dexter</li><li id="deleteTags_chzn_o_5" class="active-result" style="">Black</li><li id="deleteTags_chzn_o_6" class="active-result" style="">Blue</li><li id="deleteTags_chzn_o_7" class="active-result" style="">Body-Con</li><li id="deleteTags_chzn_o_8" class="active-result" style="">Casual</li><li id="deleteTags_chzn_o_9" class="active-result" style="">Christian_Louboutin</li><li id="deleteTags_chzn_o_10" class="active-result" style="">Clear</li><li id="deleteTags_chzn_o_11" class="active-result" style="">Coach</li></ul></div></div> 
       </div> 
      </div> 
      <div class="modal-footer"> 
       <button class="btn" data-dismiss="modal" aria-hidden="true"> 
        Close</button> 
       <input class="btn btn-primary" id="btnAddTags" value="Save" type="button"> 
       <span class="loader"></span> 
      </div> 
      <div class="alert alert-error hide"> 
       <button type="button" class="close" data-dismiss="alert"> 
        ×</button> 
       <strong>Error</strong> <span class="alert-msg"></span> 
      </div> 
      <div class="alert alert-success hide"> 
       <button type="button" class="close" data-dismiss="alert"> 
        ×</button> 
       <strong>Success</strong> <span class="alert-msg"></span> 
      </div> 

Answer 1

के लिए, आप भी स्थिति =, रिश्तेदार निरपेक्ष, या निर्धारित सेट करना होगा। जेड-इंडेक्स को 5000 की तरह कुछ भी डालने में मदद मिल सकती है। (मोडल 2000 के में az सूचकांक पर है

तो अपने सीएसएस में मैं इस जोड़ना होगा:।

.class-of-dropdown { 
    position: relative; 
    z-index: 5000; 
} 

संपादित करें: .modal-body वर्ग एक overflow-y: auto संपत्ति है, तो आप को यह बदलने की जरूरत हो सकती है। :।

.modal-body { 
    overflow-y:visible; 
} 

Answer 2

मैं भी इस एक ही समस्या हो रही थी और नहीं मिल सकता है @ hajpoj के काम करने के लिए मैं इसे निम्नलिखित सीएसएस की स्थापना करके काम करना आरंभ किया:

.modal-body { 
    position: static; 
}