Question

我正在使用Laravel和Bootstrap构建一个网站，其中包含用户发布的图书表。该表的代码如下所示：

<table class="table table-hover" id="table">
    <thead>
      <tr>
        <th class="col-md-3">Title</th>
        <th class="col-md-3">Author</th>
        <th class="col-md-2">Price</th>
        <th class="col-md-2">Courses</th>
        <th class="col-md-2">Date Added</th>
        <th class="col-md-2">More Info</th>
      </tr>
    </thead>
    <tbody class="searchable">
        @foreach($books as $book)
            <tr>
            <td>{{$book->title}}</td>
            <td>{{$book->author}}</td>
            <td>${{$book->price}}</td>
            <td>{{$book->course_code}}</td>
            <td>{{$book->added_on}}</td>
            <td><button type="button" data-toggle="modal" data-id="{{$book->id}}" href="#more_info" class="btn btn-primary">More Info</button></td>
            </tr>
        @endforeach
    </tbody>
</table>

表格每行中的按钮会打开一个模式，显示有关该书的更多信息。本书的信息使用Javascript传递给模态。这是模态的代码：

<div class = "modal fade" id = "more_info" role = "dialog">
    <div class = "modal-dialog">
        <div class = "modal-content">
            <div class = "modal-header">
                <h4 id="book_title">Title</h4>
                <h5 id="book_author">Author</h5>
            </div>
            <div class = "modal-body">
                <p id="book_price">Price: </p>
                <p id="book_school">School: </p>
                <p id="book_course_code">Course(s): </p>
                <p id="book_date">Added On: </p>
                <p>Description:<br></p>
                <p id="book_description">Description<br></p>
            </div>
            <div class = "modal-footer">
                <a class = "btn btn-default" data-dismiss = "modal">Close</a>
                <input type="hidden" name="book_id" id="book_id" value=""/>
                <button class = "btn btn-primary" data-dismiss = "modal" href="#contact_seller" data-toggle="modal">Contact Seller</button>
            </div>
        </div>
    </div>
</div>

模态右下方有一个按钮，可以调用另一个模态来联系书籍的卖家。如果用户未经过身份验证，或者该图书不属于经过身份验证的用户，我只希望显示该按钮。

我该如何处理？

我面临的主要问题是将book id作为PHP变量传递给modal，所以我可以使用这段代码：

@if(Auth::guest() or Auth::user()->id != Book::where('id','%'.book_id.'%')->first()->user_id)
    <td><button type="button" data-toggle="modal" data-id="{{$book->id}}" href="#more_info" class="btn btn-primary">More Info</button></td>
@endif

但我不知道该怎么做。

编辑：

对于Javascript部分，书籍信息首先存储在Javascript对象中，该对象包含在表格所在的同一文件的开头：

<script>
    var appVariables = {};
    appVariables.books = {!! $books->keyBy('id') !!};
</script>

然后它将包含Javascript文件，该文件包含将使用我们刚创建的对象的代码，以根据其id将书籍内容传输到模态：

$(document).ready(function () {

$('#more_info').on('show.bs.modal', function (event) {
      var button = $(event.relatedTarget) // Button that triggered the modal
      var id = button.data('id') // Extract info from data-* attributes
      var book = appVariables.books[id]; //fetching the contents of book according to id received

      var modal = $(this)
      modal.find('#book_title').text(book.title)
      modal.find('#book_author').text("By " + book.author)
      modal.find('#book_price').text("Price: $" + book.price)
      modal.find('#book_school').text("School: " + book.school)
      modal.find('#book_course_code').text("Course(s): " + book.course_code)
      modal.find('#book_date').text("Added On: " + book.added_on)
      modal.find('#book_description').text(book.description)
      modal.find('#book_id').text(book.id)
   })
});

如何将PHP变量从页面传递到模态？

编辑：

0 个答案: