Несколько модулей Bootstrap на той же странице

Question

Я работаю над http://steam-to-rent.ch/mietdampfanlagen.html. Как вы можете видеть, я использую Bootstrap коллапса и при нажатии на кнопке «Anfrage» это отображающий Bootstrap в режимном. Проблема заключается в том, что при нажатии на кнопке «модальной» второго (Anfrage), а затем закрыть модальный цвет фона остается наложение и я не могу взаимодействовать со страницей. Как я могу это решить?

Это код

<button type="button" class="btn btn-primary special" 
    style="background: #fadf3e; border: 2px solid #000; color: #000; margin-bottom: 20px; margin-top: -10px; width: 100%;" 
    data-toggle="modal" 
    data-target=".bs-example-modal-sm">Anfrage</button> 

<div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel"> 
    <div class="modal-dialog modal-sm"> 
    <div class="modal-content"> 
     <h4 style="color: #000;">Mietdampfanlage 21 kg/h 10 bar</h3> 
     <div class="col-sm-12 form"> 
      <form class="form-modal" role="form" method="post" action="index.php"> 
     <div class="form-group" style="margin-bottom: 15px !important;">  
      <div class="col-sm-12"> 
       <input type="text" class="form-control" id="name" name="name" placeholder="Vorname, Name" value=""> 
      </div> 
     </div> 
     <div class="form-group" style="margin-bottom: 15px !important;"> 
      <div class="col-sm-12 "> 
       <input type="text" class="form-control" id="name" name="firma" placeholder="Firma" value=""> 
      </div> 
     </div> 
     <div class="form-group" style="margin-bottom: 15px !important;"> 
      <div class="col-sm-12 "> 
       <input type="email" class="form-control" id="email" name="email" placeholder="E-Mail" value=""> 
      </div> 
     </div> 
     <div class="form-group" style="margin-bottom: 15px !important;"> 
      <div class="col-sm-12"> 
       <input type="text" class="form-control" id="name" name="telefon" placeholder="Telefon" value=""> 
      </div> 
     </div> 

     <div class="form-group" style="margin-bottom: 15px !important;"> 
      <div class="col-sm-12"> 
       <input type="text" class="form-control" id="name" name="zeit" placeholder="Zeitraum" value=""> 
      </div> 
     </div> 

     <div class="form-group" style="margin-bottom: 15px !important;"> 
      <div class="col-sm-12"> 
       <textarea class="form-control" rows="4" name="message" placeholder="Nachricht"></textarea> 
      </div> 
     </div> 
     <div class="form-group" style="margin-bottom: 15px !important;"> 
      <div class="col-sm-12"> 
       <input id="submit" name="submit" type="submit" value="Send" class="btn btn-primary"> 
      </div> 
     </div> 
     <div class="form-group" style="margin-bottom: 15px !important;"> 
      <div class="col-sm-10 col-sm-offset-2"> 
       <! Will be used to display an alert to the user> 
      </div> 
     </div> 
    </form></div> 
    </div> 
    </div> 
</div> 

Edit:

<button id="modal_1" type="button" class="btn btn-primary special" style="background: #fadf3e; border: 2px solid #000; color: #000; margin-bottom: 20px; margin-top: -10px; width: 100%;" data-toggle="modal" data-target=".bs-example-modal-sm">Anfrage</button> 
    <div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel"> 
     <div class="modal-dialog modal-sm"> 
     <div class="modal-content"> 
      <div class="row"> 
      <div class="col-sm-12 form"> 
       <div class="modal-header"> 
       <h4 style="color: #000;">Mietdampfanlage 21 kg/h 10 bar</h4> 
       </div>  
         <form class="form-modal" role="form" method="post" action="index.php"> 
      <div class="col-sm-12">    
      <div class="form-group"> 
        <input type="text" class="form-control" id="name" name="name" placeholder="Vorname, Name" value=""> 
       </div> 
      </div> 
         <div class="col-sm-12">  
         <div class="form-group"> 
        <input type="text" class="form-control" id="name" name="firma" placeholder="Firma" value=""> 
       </div> 
      </div> 

      <div class="col-sm-12 ">     
      <div class="form-group"> 
        <input type="email" class="form-control" id="email" name="email" placeholder="E-Mail" value=""> 
       </div> 
      </div> 

       <div class="col-sm-12 "> 
       <div class="form-group"> 
        <input type="text" class="form-control" id="name" name="telefon" placeholder="Telefon" value=""> 
       </div> 
      </div> 

       <div class="col-sm-12 ">    
       <div class="form-group"> 
        <input type="text" class="form-control" id="name" name="zeit" placeholder="Zeitraum" value=""> 
       </div> 
      </div> 

      <div class="col-sm-12 ">     
      <div class="form-group"> 
        <textarea class="form-control" rows="4" name="message" placeholder="Nachricht"></textarea> 
       </div> 
      </div> 

      <div class="col-sm-12 ">     
      <div class="form-group"> 
        <input id="submit" name="submit" type="submit" value="Send" class="btn btn-primary"> 
       </div> 
      </div> 
      <div class="form-group" style="margin-bottom: 15px !important;"> 
       <div class="col-sm-10 col-sm-offset-2"> 
        <! Will be used to display an alert to the user> 
       </div> 
      </div> 
     </form></div> 
     </div> 
      </div> 
     </div> 
    </div> 

Answer 1

data-backdrop="static" 
data-keyboard="false" 

первый взгляд и посмотреть, если есть данные, фон = "Static" в любом месте. Это сделало бы это. Также убедитесь, что клавиатура данных НЕ является ложной, чтобы убедиться, что вы можете взаимодействовать.

Последнее, что я хочу, чтобы вы на идентификатор на кнопках и модальностей. убедитесь, что все они разные. Я не вижу на этом ID модальными здесь, так что я хотел бы предложить что-то вроде

id="modal_1" 

на кнопку и модальный. Убедитесь, что он соответствует