ajax - 在 laravel 中使用模态引导显示特定数据
问题描述
索引刀片.php
<a data-toggle="modal" data-target="#showModal" href="#" value="{{ route('member.show', $member->id) }}" class="text-secondary">Show data</a>
路线:
Route::get('/member/show/{member}', 'MemberController@show')->name('member.show');
成员控制器
public function show($id) {
$member = User::find($id);
return view('menus.member.index', compact('member'));
}
index.blade.php 中的模态
<div class="modal fade" id="showModal" tabindex="-1" role="dialog" aria-labelledby="showModal" aria-hidden="true">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title"></h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close" onclick="clearData()">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
</div>
</div>
</div>
如何使用 ajax 使模态显示 index.blade.php 中的数据?
解决方案
Bootstrap 涵盖了:https ://getbootstrap.com/docs/4.5/components/modal/#varying-modal-content
在您的按钮上更改value
为data-link=""
Then in js:
$('#showModal').on('show.bs.modal', function (event) {
var button = $(event.relatedTarget) // Button that triggered the modal
var link = button.data('link') // Extract info from data-* attributes
$.get(link).then(response => {
//fill your modal with data
})
})
推荐阅读
- c# - 创建动态优惠券检查器
- mysql - 如何在mysql中正确使用float类型?
- r - ggplot2(版本 3)与 geom_density_2d 的 ggmap 不兼容
- ios - 优化 Google Map ios sdk 上的许多标记?
- c# - 使用 appsettings 和 IOptions 接口的 .NET 标准库的推荐模式是什么?
- mongodb - Mongoose 播种机:尚未为模型注册模式
- android - 为什么 RxJava 中的 take(5) 运算符返回所有对象
- bash - Kubernetes cron 作业在循环中调用 curl
- javascript - JSON 和 JavaScript 错误
- node.js - node.js 认证中间件