Question

我遇到了一个问题。我创建了编辑表单抛出ajax模态显示。我的代码工作正常，但模态显示重叠。

这是我的代码..

$('.edit-currency').on('click', function(){
            // create the backdrop and wait for next modal to be triggered
            var el = $(this);
            var id = el.attr('data-id');
            var fullUrl = site_url+'/currency/edit/'+id;
            $('body').modalmanager('loading');
            setTimeout(function(){
                $currencyEditModal.load(fullUrl, '', function(){
                    $currencyEditModal.modal();
                });
            }, 1000);
        });

//我的模态名为

<a href="javascript:;" class="edit-currency" data-id="{{ $value->id }}">
                                                    <i class="fa fa-edit"></i> Edit </a>

<div id="ajax-currency" class="modal fade" tabindex="-1"> </div>

// controller

  public function edit($id)
{
    $data['page_title'] = $this->page_title;
    return view('currencies.ajax-edit', $data);
}

//这是我的

<div class="modal-dialog">
<div class="modal-content">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
        <h4 class="modal-title">Modal Title</h4>
    </div>
    <div class="modal-body"> Modal body goes here </div>
    <div class="modal-footer">
        <button type="button" class="btn dark btn-outline" data-dismiss="modal">Close</button>
        <button type="button" class="btn green">Save changes</button>
    </div>
</div>

这是我的输出截图

Answer 1

我认为缺少</div>？

<div class="modal-dialog">
<div class="modal-content">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
        <h4 class="modal-title">Modal Title</h4>
    </div>
    <div class="modal-body"> Modal body goes here </div>
    <div class="modal-footer">
        <button type="button" class="btn dark btn-outline" data-dismiss="modal">Close</button>
        <button type="button" class="btn green">Save changes</button>
    </div>
</div>
</div> <!-- missing end tag i think? -->

Answer 2

删除模态对话框和模态内容。

这是我的最终模态

<div class="modal-header">
     <button type="button" class="close" data-dismiss="modal" aria hidden="true"></button>
     <h4 class="modal-title">Modal Title</h4>
</div>
<div class="modal-body"> 
   Modal body goes here
</div>
<div class="modal-footer">
    <button type="button" class="btn dark btn-outline" data dismiss="modal">Close</button>
    <button type="button" class="btn green">Save changes</button>
</div>

ajax调用后模态显示无效

2 个答案: