简体   繁体   English

Laravel Ajax模型显示帖子

[英]Laravel ajax model to show posts

I have a foreach() from database table, I want to show a popup/model to show its extra information. 我有一个来自数据库表的foreach() ,我想显示一个弹出窗口/模型以显示其额外信息。

I am showing just title and description and on click i want to open up a popup and show its extra information. 我只显示标题和描述,然后单击以打开一个弹出窗口并显示其额外信息。

@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

I am completely blank, Should i fetch post id to a hidden html tag and on model button click an ajax call will fetch the record info based on the id ? 我完全空白,是否应该将帖子ID提取到隐藏的html标记中,然后在模型按钮上单击ajax调用即可根据id提取记录信息?

I would add a data-id attribute to one of the elements, possibly the wrapper, then add something like 我会向其中一个元素(可能是包装器)添加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.
           }
        })
  }

}); });

Update 更新资料

I just noticed you already have bootstrap modal there. 我只是注意到您那里已经有引导模态。

you can add your data-id to data-toggle element then in javascript 您可以将data-id添加到data-toggle元素,然后在javascript中

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

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM