laravel ajax后Laravel刷新数据
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/37690068/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Laravel refresh data after ajax
提问by bradley546994
He is currently working on code that has to filter the data in the table. Ajax will call the link and gets the response (json) results with answer. However, I came across a problem. I have to somehow render tables and I do not want to do this by append etc.
他目前正在编写必须过滤表中数据的代码。Ajax 将调用该链接并获取带有 answer 的响应 (json) 结果。但是，我遇到了一个问题。我必须以某种方式呈现表格，我不想通过附加等来做到这一点。
Can I somehow again generate views or blade file?
我可以以某种方式再次生成视图或刀片文件吗？
The default view is DefController@index but ajax use url which controller is DefController@gettabledata.
默认视图是 DefController@index 但 ajax 使用控制器是 DefController@gettabledata 的 url。
public function gettabledata($id){
return response()->json(Def::find($id)->getallmy->all());
}
回答by Webinan
You can put the part in your template corresponding to the table in a separate .blade.phpfile, and @includethat in your main layout.
您可以将模板中与表格对应的部分放在单独的.blade.php文件中，并将@include其放在主布局中。
main.blade.php:
main.blade.php：
<html>
...
<body>
<div class="table-container">
@include('table')
</div>
</body>
...
And
和
table.blade.php:
table.blade.php：
<table>
@foreach($rows as $row)
<tr>
<td> $row->title ... </td>
</tr>
@endforeach
</table>
In this way you can use a simple jQuery $('div.table-container').load(url)and on your server just render and respond that part as an html string. return view('table', $data)
通过这种方式，您可以使用一个简单的 jQuery，$('div.table-container').load(url)然后在您的服务器上将该部分作为 html 字符串呈现和响应。return view('table', $data)
Javascript:
Javascript：
function refreshTable() {
$('div.table-container').fadeOut();
$('div.table-container').load(url, function() {
$('div.table-container').fadeIn();
});
}
回答by JasonK
The answer is yes, you can. Webinan certainly pointed you in the right direction. This approach is slightly different.
答案是肯定的，你可以。Webinan 无疑为您指明了正确的方向。这种方法略有不同。
First things first, you need a seperate view for the table. A very basic example for the HTML markup:
首先，您需要一个单独的表格视图。HTML 标记的一个非常基本的示例：
<div class="table-container">
@include('partials.table') // this view will be async loaded
</div>
We start by making a call to the server with jQuery (can be done with Javascript too) using the shorthand ajax function: var $request = $.get('www.app.com/endpoint');. You can also pass along any data to your controller on the backend.
我们首先使用简写 ajax 函数使用 jQuery（也可以使用 Javascript 完成）调用服务器：var $request = $.get('www.app.com/endpoint');。您还可以将任何数据传递给后端的控制器。
Now on the serverside, within your controller, render and return the table view:
现在在服务器端，在你的控制器中，渲染并返回表格视图：
class EndpointController extends Controller
{
/**
* Returns a rendered table view in JSON format.
*
* @param Request $request
* @return \Illuminate\Http\JsonResponse
*/
public function ajax(Request $request)
{
$html = view('partials.table', compact('view'))->render();
return response()->json(compact('html'));
}
}
If everything worked out, the donecallback will be triggered. Simply grab the html variable and set it as the content of the table's container.
如果一切顺利，done将触发回调。只需获取 html 变量并将其设置为表容器的内容。
function renderTable() {
var $request = $.get('www.app.com/endpoint'); // make request
var $container = $('.table-container');
$container.addClass('loading'); // add loading class (optional)
$request.done(function(data) { // success
$container.html(data.html);
});
$request.always(function() {
$container.removeClass('loading');
});
}
Hope this helps!
希望这可以帮助！
回答by AKMorris
To update and change page content without reloading the page in Laravel 5.4 i do the following:
要更新和更改页面内容而不在 Laravel 5.4 中重新加载页面，我执行以下操作：
First create the blade view in the "views" folder called "container.blade.php" it will contain the following code (in this case a select box that is rendering a list of abilities from the package Bouncer (but you can use the @foreach on any Laravel collection you like):
首先在名为“container.blade.php”的“views”文件夹中创建刀片视图，它将包含以下代码（在本例中是一个选择框，它正在呈现来自 Bouncer 包的能力列表（但您可以使用 @ foreach 在你喜欢的任何 Laravel 集合上）：
<select>
{{ $abilityList = Bouncer::role()::where('name','admin')->first()->getAbilities()->pluck('name') }}
@foreach ( $abilityList as $ab )
<option value="{{ $ab }}">{{ $ab }}</option>
@endforeach
</select>
Add this to you main blade file (e.g. home.blade.php) making sure to use a div with an id you can reference:
将此添加到您的主刀片文件（例如 home.blade.php），确保使用带有您可以引用的 id 的 div：
<div id="abilityListContainer">
@include('container')
</div>
Now on your main blade file (e.g. home.blade.php) add a button that will trigger the function that will communicate with the Laravel controller:
现在在你的主刀片文件（例如 home.blade.php）上添加一个按钮来触发与 Laravel 控制器通信的函数：
<input type="button" value="reload abilities" onClick="reloadAbilities()"></input>
Then add the javascript for this function, this loads the generated html into your div container (note the "/updateAbility" route next to ".get" - this is a Laravel route which we will set up in the next step):
然后为此函数添加 javascript，这会将生成的 html 加载到您的 div 容器中（注意“.get”旁边的“/updateAbility”路由 - 这是我们将在下一步中设置的 Laravel 路由）：
var reloadAbilities = function()
{
var $request = $.get('/updateAbility', {value: "optional_variable"}, function(result)
{
//callback function once server has complete request
$('#abilityListContainer').html(result.html);
});
}
Now we set up the Laravel route for this action, this references our controller and calls the function "updateAbilityContainer". So edit your /routes/web/php file to have the following route:
现在我们为这个动作设置 Laravel 路由，它引用我们的控制器并调用函数“updateAbilityContainer”。因此，编辑您的 /routes/web/php 文件以具有以下路线：
Route::get('updateAbility', array('as'=> 'updateAbility', 'uses'=>'AbilityController@updateAbilityContainer'));
Finally in app/Http/Controllers make the file "abilityController.php" (you can also use "php artisan make:controller abilityController"). Now add this function to process the changes, generate the html and return it to the javascript function (note you may also have to use the namespaces as well):
最后在 app/Http/Controllers 中创建文件“abilityController.php”（你也可以使用“php artisan make:controller abilityController”）。现在添加此函数来处理更改，生成 html 并将其返回给 javascript 函数（请注意，您可能还必须使用命名空间）：
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Input;
class AbilityController extends Controller
{
public function updateAbilityContainer()
{
// use this if you need to retrieve your variable
$request = Input::get('value');
//render and return the 'container' blade view
$html = view('container', compact('view'))->render();
return response()->json(compact('html'));
}
}
Thats it, your blade "container" will now reload when you click the button and any changes to the collection you are rendering should update without reloading the page.
就是这样，当您单击按钮时，您的刀片“容器”现在将重新加载，并且您正在呈现的集合的任何更改都应该在不重新加载页面的情况下更新。
Hopefully this fills in some blanks left in the other answers. I hope it works for you.
希望这可以填补其他答案中留下的一些空白。我希望这个对你有用。
