【问题标题】:Display Bootstrap Modal if the condition is true?如果条件为真,显示 Bootstrap Modal?
【发布时间】:2016-07-18 09:35:03
【问题描述】:

如果条件为真或假,我想在 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>

如何实现???

【问题讨论】:

  • 你的代码在哪里?你试过什么?
  • 请用一些有效代码和您尝试过的内容更新问题。
  • 嗨@BonMacalindong 更新了问题,请检查。

标签: c# asp.net .net asp.net-mvc bootstrap-modal


【解决方案1】:

试试下面的代码,它工作正常。我在 jsfiddle 中创建了链接
http://jsfiddle.net/h3WDq/1543/

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

【讨论】:

  • 加 1 用于添加 jsFiddle 链接。
  • 谢谢@AmteBlessed :-)
  • 是的@MayankBhuvnesh
  • 没什么我想你再检查一遍@MayankBhuvnesh
  • @Surajghosi 感谢您的回复。我试过这个,但没有显示模态。
【解决方案2】:

您可以尝试从脚本打开弹出窗口。

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

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2013-02-11
    • 2013-08-14
    • 2018-06-30
    • 2014-10-23
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多