首页 > 解决方案 > 在 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">&times;</span>
        </button>
      </div>
      <div class="modal-body">

      </div>
  </div>
</div>

如何使用 ajax 使模态显示 index.blade.php 中的数据?

标签: ajaxlaraveltwitter-bootstrap

解决方案


Bootstrap 涵盖了:https ://getbootstrap.com/docs/4.5/components/modal/#varying-modal-content

在您的按钮上更改valuedata-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
  })
})

推荐阅读