当前位置:  开发笔记 > 编程语言 > 正文

Laravel 4中的Bootstrap模态对话框

如何解决《Laravel4中的Bootstrap模态对话框》经验,为你挑选了1个好方法。

我在视图中有一个用于删除记录的表单,我想要一个确认对话框,以显示何时单击删除按钮.在我看来,我有这个:

{{ Form::model($event, array('route' => array('events.destroy', $event->id), 'method' => 'Delete')) }}
    {{ Form::submit('Delete', array('class' => 'btn-small btn-danger delete-event', 'data-toggle' => 'modal', 'data-title' => 'Delete Event', 'data-content' => 'Are you sure you want to delete this event?')) }}
{{ Form::close() }}

我希望能够获取数据属性并使用jQuery动态填充Twitter Bootstrap模式对话框,但我不确定如何处理这个问题.

你们会做什么?基本上,当点击删除按钮时,我想要一个模态窗口,其中包含数据属性的标题和内容,以及取消按钮和删除按钮.如果用户点击删除按钮,我想提交表单.

请注意,此视图包含一个记录表,每个记录都有一个删除表单/按钮,这一点很重要.

真的很感谢你对这一个人的帮助.干杯.

编辑:我现在有这个,几乎可以工作,但它没有提交表格?

$('.delete-event').click(function(event) {
    event.preventDefault();

    var title = $(this).attr('data-title');
    var content = $(this).attr('data-content');

    $('#event-modal').html(title);
    $('.modal-body p').html(content);
    $('.modal-footer .delete').html(title);
    $('#event-delete').modal('show');

    $('.delete').click(function(event) {
        $('#event-delete').modal('toggle');
        $('.delete-event').submit();
    });
});

Antonio Carl.. 5

我没有使用表单,只是一个形状为按钮的链接:

{{ Html::link(URL::route('event.destroy',$event->id), 'Delete', array('class' => 'btn btn-small btn-danger delete-event', 'data-title'=>'Delete Event', 'data-content' => 'Are you sure you want to delete this event?', 'onClick'=>'return false;')) }}

这个javascript:

jQuery('.delete-event').click(function(evnt) {
            var href = jQuery(this).attr('href');
            var message = jQuery(this).attr('data-content');
            var title = jQuery(this).attr('data-title');

            if (!jQuery('#dataConfirmModal').length) {
                jQuery('body').append('');
            } 

            jQuery('#dataConfirmModal').find('.modal-body').text(message);
            jQuery('#dataConfirmOK').attr('href', href);
            jQuery('#dataConfirmModal').modal({show:true});
})

这是一个工作小提琴:http://jsfiddle.net/antonioribeiro/wYbwv/



1> Antonio Carl..:

我没有使用表单,只是一个形状为按钮的链接:

{{ Html::link(URL::route('event.destroy',$event->id), 'Delete', array('class' => 'btn btn-small btn-danger delete-event', 'data-title'=>'Delete Event', 'data-content' => 'Are you sure you want to delete this event?', 'onClick'=>'return false;')) }}

这个javascript:

jQuery('.delete-event').click(function(evnt) {
            var href = jQuery(this).attr('href');
            var message = jQuery(this).attr('data-content');
            var title = jQuery(this).attr('data-title');

            if (!jQuery('#dataConfirmModal').length) {
                jQuery('body').append('');
            } 

            jQuery('#dataConfirmModal').find('.modal-body').text(message);
            jQuery('#dataConfirmOK').attr('href', href);
            jQuery('#dataConfirmModal').modal({show:true});
})

这是一个工作小提琴:http://jsfiddle.net/antonioribeiro/wYbwv/

推荐阅读
pan2502851807
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有