Кнопка не работает в HTML

Question

Я следующий код здесь:

<div class="container-fluid"> 
    <div class="row-fluid"> 
     <div class="centering col-lg-8 topSection" style="text-align: center;"> 
      <div class="col-lg-12" style="padding-top: 160px;"> 
       <h2 style="color: #fff; font-size: 30px;">Get discovered - Discover - Connect</h2> 

       <h3 style="color: #fff; font-size: 23px;">We love everyting about music. The scene. The people. The livestyle. We live for it.</h3> 
       <button type="submit" class="btn_style_1 btn" data-toggle="modal" data-target="#myModalLogin">Sign in</button> 
       <button type="submit" class="btn_style_1 btn" data-toggle="modal" data-target="#myModal">Join now</button> 
      </div> 
     </div> 
    </div> 
</div> 

При запуске приложения, кнопки не работают. Ничего не происходит, когда я нажимаю кнопки. При наведении курсора курсор не преобразуется в указатель.

Однако, когда я удаляю centering col-lg-8 topSection, кнопка входа работает, но не другая кнопка.

У кого-нибудь была такая же проблема?

EDIT:

Я имел это в моем Layout.cshtml:

<div class="col-lg-12"> 
     @RenderBody() 
    </div> 

Когда я удалил DIV, он работал.

Answer 1

Снимите type="submit" или замените его на type="button". Ваше решение будет:

<button type="button" class="btn_style_1 btn" data-toggle="modal" data-target="#myModalLogin">Sign in</button> 
<button type="button" class="btn_style_1 btn" data-toggle="modal" data-target="#myModal">Join now</button>