条件が真であればブートストラップモーダルを表示しますか？

条件がtrueまたはfalseの場合、ASp.net MVCのボタンクリックでブートストラップモーダルを表示します。たとえば、ログイン資格情報をチェックし、失敗した場合は、ブートストラップ・モーダルまたはブートストラップ・アラートにエラーを表示する方法を教えてください。条件が真であればブートストラップモーダルを表示しますか？

<html> 
<head> 
    <link href="~/bootstrap.min.css" rel="stylesheet" /> 
    <script src="~/bootstrap.min.js"></script> 
    <script src="https://code.jquery.com/jquery-3.1.0.min.js"></script> 

    <script> 
     $(function() 
     { 
      $("#mybutton").click(function(){ 
       var test1 = $('#test').val(); 
       if(test1 == "Value") 
        $("#myModal").modal('show'); 
      }); 
     }); 
    </script> 

</head> 
<body> 

     <input type="text" class="form-control" id="test" placeholder="Enter A Value" /> 
     <button type="submit" value="Click" name="click" id="mybutton">Click Me!</button>    


    <!-- Modal --> 
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> 
     <div class="modal-dialog" role="document"> 
      <div class="modal-content"> 
       <div class="modal-header"> 
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
        <h4 class="modal-title" id="myModalLabel">Modal title</h4> 
       </div> 
       <div class="modal-body"> 
        ... 
       </div> 
       <div class="modal-footer"> 
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
        <button type="button" class="btn btn-primary">Save changes</button> 
       </div> 
      </div> 
     </div> 
    </div> 
</body> 
</html>

どのように達成できますか？

出典

2016-07-18 Mayank Bhuvnesh

あなたのコードがあるにリンクを作成したのですか？何を試しましたか？ –

有効なコードと試した内容で質問を更新してください。 –

こんにちは@BonMacalindong 質問を更新してください。 –

スクリプトからポップアップを開くことができます。

<script type="text/javascript"> 
    function OpenPopup() { 
     if(condition){ 
     $("#YourModalId").modal('show'); 
     } 
    } 
</script>

出典

2016-07-18 09:40:52

コードの下にその作業罰金をお試しください。私はjsfiddle
http://jsfiddle.net/h3WDq/1543/

<script> 
$(function() 
{ 
    $("#mybutton").click(function(){ 
    var mycodition=true; 
    if(mycodition) 
    $("#myModal").modal('show'); 
    return false; 
}); 
});

出典

2016-07-18 09:53:35 Surajghosi

にjsFiddleリンクを追加する場合は1を加えます。 –

ありがとう@AmeteBlessed :-) – Surajghosi

こんにちは@Surajghosiあなたはコードをチェックしました??? –

条件が真であればブートストラップモーダルを表示しますか？

答えて

関連する問題