javascript - Laravel ajax 模型显示帖子

Question

我有一个来自数据库表的foreach()，我想显示一个弹出窗口/模型来显示其额外信息。

我只显示标题和描述，单击后我想打开一个弹出窗口并显示其额外信息。

@foreach($myProjects as $project)
    <div class="col-sm-4 col-md-4 notes notes--blue">
        <a href="#edit-note" data-toggle="modal" style="background-color: #f9f9f9;border-bottom: 5px solid #42A5F5">
            <div class="notes__title">{{$project->title}}</div>
            <div class="notes__body">{{$project->description}}</div>
        </a>
        <div class="notes__actions" data-demo-action="delete-listing">
             <i class="zmdi zmdi-delete"></i>
        </div>
        <div class="notes__actions1" data-demo-action="delete-listing">
              <i class="zmdi zmdi-edit"></i>
        </div>
        <div class="notes__actions2" data-demo-action="delete-listing">
              <i class="zmdi zmdi-eye"></i>
        </div>
    </div>
@endforeach

我完全空白，我应该将帖子 ID 获取到隐藏的 html 标签，然后在模型按钮上单击 ajax 调用将根据 id 获取记录信息吗？

Answer 1

我会向其中一个元素(可能是包装器)添加一个 data-id 属性，然后添加类似的内容

$(document.body).on('click', '.clickable_element', function(e){
  if ($(this).data('id')) {
        $.ajax({
           url : 'your detail url', 
           data: { id: parseInt( $(this).data('id'), 10 ), 
           success : function(response){
               // open popup and add response into it.
           }
        })
  }

});

更新

我刚刚注意到你已经有引导模式了。

您可以将您的 data-id 添加到 data-toggle 元素，然后在 JavaScript 中

$('[data-toggle=modal]').on('shown.bs.modal' , function(){
  // do your ajax stuff
  // add response in `.modal-body`
})