从日期选择器引导框中选择日期后，模式隐藏

After Selecting date from datepicker bootbox modal hide

本文关键字：日期隐藏选择模式选择器更新时间：2023-11-22

"添加新"按钮代码：

    $('#AddButton').on('click', function() {
               bootbox
            .dialog({
                title: 'Add Transfer Details',
                message: $('#userForm'),
                show: false // We will show it manually later
            })
            .on('shown.bs.modal', function() {
                $('#userForm')
                    .show();
            })
            .on('hide.bs.modal', function(e) {
                // Bootbox will remove the modal (including the body which contains the login form)
                // after hiding the modal
                // Therefor, we need to backup the form
                $('#userForm').hide().appendTo('body');
            })
            .modal('show');
    });

点击上面的按钮后，运行代码并显示一个弹出的引导框。我在这个模式中有日期选择器。从日期选择器中选择日期后，我的引导框模式立即隐藏。请帮助解释为什么会发生这种情况

我的日期选择器代码：

    $('#payDate').datepicker({
        format: 'dd-mm-yyyy',
    }).on('changeDate', function(e){
        $(this).datepicker('hide');
    });

更新：

Jsfidle链接（我面临的这个问题）

https://jsfiddle.net/paramj/sww1dnvk/3/

您发布的问题是错误的，您的模态没有被隐藏。它是在你的模式上输入类型文本字段。因为下面的行

$(this).datepicker('hide');

更换

$('#payDate').datepicker({
        format: 'dd-mm-yyyy',
    }).on('changeDate', function(e){
        $(this).datepicker('hide');
    });

带有

$('#payDate').datepicker({
        format: 'dd-mm-yyyy',
    }).on('change', function(){
        $('.datepicker').hide();
    });

因为当你使用"this"时，它会选择输入类型文本（"id=payDate"）字段作为文档元素，并在其上应用jquery隐藏。

在这里犯了错误

 .on('hide.bs.modal', function(e) {
                // Bootbox will remove the modal (including the body which contains the login form)
                // after hiding the modal
                // Therefor, we need to backup the form
                $('#userForm').hide().appendTo('body');
            })

删除

$('#userForm').hide().appendTo('body');

因此生成的javascript片段将是

$('#AddButton').on('click', function() {
            bootbox
                .dialog({
                    title: 'Add Transfer Details',
                    message: $('#userForm'),
                    show: true // We will show it manually later
                })
                .on('shown.bs.modal', function() {
                    $('#userForm')
                        .show();                             // Show the login form
                })
                .on('hide.bs.modal', function(e) {
                    // Bootbox will remove the modal (including the body which contains the login form)
                    // after hiding the modal
                    // Therefor, we need to backup the form
                })
                .modal('show');

        });
    $('#payDate').datepicker({
        format: 'dd-mm-yyyy',
    }).on('change', function(){
        $('.datepicker').hide();
    });