如何在bootstrap3模式框上显示我的自定义警报框?

尼辛·莫汉(Nithin Mohan)

我有一个形式的引导模态。当我单击保存按钮时,我的jquery函数将检查表单元素是否为空。如果为空,将显示自定义的错误消息。

<!-- Modal -->
        <div class="modal fade" id="Item-Modal" form-name="ItemMaster" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" >
            <div class="modal-dialog">
                <div class="modal-content">
                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                        <h4 class="modal-title" id="heading"></h4>
                    </div>
                    <div class="modal-body">
                        <form class="form-horizontal" action="" method="post" id="ItemADD">
                                                            <div class="form-group">
                                <label for="inputItemName" class="col-sm-4 control-label">Item Name</label>
                                <div class="col-sm-5">
                                    <input type="text" class="form-control enter modal-count" id="ItemName" value="" tabindex="1" required>
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="modal-footer">
                        <button type="submit" class="btn btn-primary modal-save" tabindex="2" id="btnsave">Save changes</button>
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                    </div>
                </div>
            </div>
        </div>

// jQuery

<script>
        $(document).ready(function () {
            $('#Item-Modal').on('shown.bs.modal', function () {
                $("#btnsave").on('click', function () {
                    var value = $('#ItemName').val();
                    if (value == '') {
                        Simple.render1('Please enter a vehicle brand name!');// my custom alert box
                    }
                });
            });
        });
    </script>

我的问题是警报框出现在模式框的下方。解决方案是什么(正常警报框正在工作...)

尼辛·莫汉(Nithin Mohan)

我自己找到了解决方案。这是有关CSS的问题。在显示页面上添加以下代码

#div_id{
  z-index: 5000;
 }

其中div_id是警报框主体的div名称......

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

如何在jqgrid的custom_func中显示自定义警报框

Bootstrap 4-自定义警报弹出框

如何关闭“自定义警报”对话框

Android-如何在自定义警报对话框中检查按钮单击?

如何在自定义警报对话框中刷新内容/ UI

如何在Android中使用网格视图创建自定义警报对话框?

我如何更改或自定义警报颜色bootstrap 4和Ruby on Rails 5

如何在 JavaScript 中自定义警报?

如何在我的自定义对话框上显示进度对话框?

如何自定义警报对话框,以使按钮适合警报对话框

如何在自定义警报对话框中将信息从活动传递到编辑文本

Flutter-自定义警报对话框未显示

在服务android中显示自定义警报对话框

当您导航到其他页面时,显示类似facebook的自定义警报框

在自定义警报对话框中从 Edittext 检索数据时显示空值?

无法显示/显示自定义警报

创建自定义警报框时发生异常

jQuery中的自定义警报和确认框

JavaScript 和 HTML 自定义警报框

Android中的“自定义警报”对话框

如何制作自定义警报对话框全屏

我如何做自定义警报操作表?

如何在ionic 2中进行自定义警报?

如何在React Native中使用自定义警报?

在自定义警报对话框上使用约束布局

JavaFx自定义警报阶段

快速自定义警报(UIAlertView)

SwiftUI:创建自定义警报

如何在Xamarin Android中基于设备的宽度和高度以编程方式创建自定义警报对话框?