Laravel 将数据从 ajax 传递到位于单独文件中的模态视图，导致模态视图无法呈现

Posted 2023-03-14

【中文标题】Laravel 将数据从 ajax 传递到位于单独文件中的模态视图，导致模态视图无法呈现

【英文标题】：Laravel passing data from ajax to modal view which is on a separate file causing modal to not render

【发布时间】：2019-01-13 05:52:05

【问题描述】：

这是我的刀片视图，它列出了借方及其所有属性，例如 id、名称、地址。这也有一个模态视图按钮，它弹出一个模态，应该通过 id 查询借记卡，然后显示它的详细信息data-target="#viewModal" onclick='showDetail($var->id);

(ajax_table.blade):

<?php
if(!empty($data))$isi = json_decode($data);
if(!empty($modaldata))$isimodal = json_decode($modaldata);
 ?>

@if(!empty($isi->data))
    @foreach($isi->data as $var)
    @include('userdebitur.ajax_modal_view')
    <tr>
        <td> $var->id </td>
        <td> $var->name </td>
        <td> $var->address </td>
        @endif
        <td>
            <div class="btn-group">
                <button title="Detail Info" type="button" class="btn btn-default btn-flat" data-toggle="modal" data-target="#viewModal" onclick='showDetail($var->id);'><i class="fa fa-eye"></i></button>
            </div>
        </td>
    </tr>
    @endforeach
@else
    <tr><td align="center" colspan="5">Not found.</td></tr>
@endif

这是我从上面调用的模态文件（ajax_modal_view.blade）：

    <div class="modal fade" id="viewModal">
        <div class="modal-dialog">
            <div class="modal-content mdl-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">Default Modal</h4>
                </div>
                <div class="modal-body">
                    <p>test @if(isset($isimodal))var_dump($isimodal) @endif</p> //I'm trying to output this
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default pull-left" data-dismiss="modal">Close</button>
                    <button type="button" class="btn btn-primary">Save changes</button>
                </div>
            </div>
        </div>
    </div>

模态视图按钮也调用了 showDetail()，将借记卡 ID 作为变量传递，然后通过调用 ajax.blade 中的函数从控制器返回数据：

function showDetail(id)

    $.ajax(
        type:"GET",
        url: " url('ajax/userdebitur/') "+"/"+id,
        dataType: "json",
        cache: false,
        success: function(modaldata)        
            $("#viewModal").html(modaldata.view); //this is likely the problem
        ,
        error: function (modaldata) 
            // 
        
    );

这是我的控制器：

public function getdebitur($id)

    $content = Debitur::find($id);
    $modaldata['content'] = $content;
    $modaldata['view'] = view('userdebitur.ajax_modal_view')->with('modaldata', json_encode($content))->render();

    echo json_encode($modaldata);

在 Web 浏览器中使用控制台时，我已成功检索到显示所有对象的选定借记数据，但是我似乎无法将任何内容传递给模态。 我尝试将数据传递给 ajax_table.blade 本身，在 ajax_table.blade 中移动模态，在没有控制器视图的情况下传递数据，在模态本身内部移动 json_decode($modaldata)，但均无济于事。

如果在 ajax.blade 我使用 $("#viewModal").html(modaldata.view); 模态显示一秒钟然后消失，但如果我使用 $("#viewModal").modal(modaldata.view); 或 $("#viewModal").modal(modaldata); 它显示没有 $isimodal 值。

我想要做的：获取从控制器传递的值并将其var_dump到模态中。

【问题讨论】：

或许可以试试$("#viewModal").append。

How can I return a view from an ajax call in Laravel 5的可能重复

【参考方案1】：

我解决了这个问题。该错误是由另一个模态中的 ajax 更新模态引起的，而不是替换整个模态。

解决方案是从我的模态文件中删除<div class="modal fade" id="viewModal">，然后它将正确呈现。