Laravel：使用 AJAX 请求渲染部分视图

Posted 2023-03-14

【中文标题】Laravel：使用 AJAX 请求渲染部分视图

【英文标题】：Laravel: rendering partial views with AJAX requests

【发布时间】：2014-09-18 23:33:00

【问题描述】：

我正在尝试制作一个单页 CRUD 应用程序，并且我正在使用 AJAX 和 jQuery。在这种情况下，我提交表单并将新国家/地区异步存储在我的数据库中，然后使用新数据呈现部分视图。

这是我的脚本和从数据库中检索国家并返回部分视图的方法。

$('#create-country-form').submit(function(event) 
    $.post('/country/store', $('#create-country-form').serialize(), function() 
        $.get('/country/all', function(data) 
            $('#countries-table').empty();
            $('#countries-table').append(data['html']);
        );
    );
    event.preventDefault();
);

class CountryController extends BaseController 

    public function all() 
        $countries = Country::All();

        $html = View::make('countries.list', compact('countries'))->render();

        return Response::json(['html' => $html]);
    

    // ...

但是，我不喜欢使用 jQuery 在页面中实际渲染视图的想法，感觉这应该是 Laravel 的工作。

如何使用 Laravel 渲染部分视图以及使用 AJAX，而不必将这项工作委托给 jQuery（append() 和 empty()）？

【问题讨论】：

我同意为此提供某种插件会很酷。我认为你可以很容易地创建一个 JS 实用程序。

【参考方案1】：

你搞糊涂了。

Laravel 已经在渲染局部。您正在调用View::make() 并将渲染的 视图返回给$html。

然后你将渲染视图传递给 jQuery，它只是显示给它的数据——它本身不做任何计算。

【讨论】：

是的，我知道 Laravel 正在渲染视图，但它必须是 jQuery 告诉返回的数据必须分配给特定的 DOM 元素。 Laravel 不能用 Blade 做到这一点吗？

否 - AJAX 只能通过 jQuery（或 javascript）实现。 Laravel 是 php，所以它只能在视图的初始加载时编译一次。你正在做的是正确的做法。

所以我这样做是唯一的方法吗？另外，关于这个问题，当显示会话闪存消息时，由于页面没有被重新加载，Blade @if 等不会发生，我不会在页面中看到这些消息。我应该从控制器返回它们并使用 jQuery 将它们分配给页面吗？

【参考方案2】：

查看文件前使用字符串方法

return (String) view('Company.allUserAjax');

【参考方案3】：

将您的视图传递给视图助手，将其呈现为变量并将该变量作为对 AjAx 的响应返回。

$view=view('your-view-blade');
$view=$view->render();
$responseData->responseSuccess($view);

在您的 AjAx 回调中，您可以使用该呈现的 HTML，您可以随意将该 HTML 附加到任何元素。

【参考方案4】：

你可以通过render()函数渲染视图，然后通过JSON响应返回

$arr['key1'] = value; 
$arr['key2'] = value; 

$view = view('view.name', $arr)->render();
return Response::json(['status' => 200, 'view' => $view]);

【讨论】：

请不要只发布代码作为答案，还要说明您的代码的作用以及它如何解决问题的问题。带有解释的答案通常质量更高，更有可能吸引投票。

【参考方案5】：

我认为您将客户端与服务器混淆了。

您使用 jQuery 或 Javascript fetch 或其他方式从客户端进行调用。 该请求转到一个 url，可能是您后端的 API 或控制器。 该控制器将返回部分视图。 您只需获取 ajax 调用成功的响应，然后在前端呈现。

在不刷新页面的情况下动态呈现内容是一种非常简单有效的方法。只需获取您需要的内容，节省带宽和页面加载时间。