如何通过使用Laravel以自举模式获取动态数据? [英] How to get dynamic data in bootstrap modal by using Laravel?

问题描述

我正在开发一个应用程序，该应用程序要求在不同图标列表上的每次单击都显示数据.问题是如何根据id在引导模式中显示数据.预先感谢.

I am developing an app which requires to show the data at every click on my different list of icon. The problem is how to display data in to bootstrap modal according to id. Thanks in advance.

在这里，我已经尝试过了，但是没有全部使用..

Here, I have tried with, but not working all..

       <div class="col-xs-12 col-sm-6 col-md-3">

                @foreach($Play as $post)
                <div class="member">
                    <div class="member-img">
                        @if ($post->new_game)
                            <img src="{{ $post->new_game}}" alt="member" />@endif

                    </div>
                    <!-- .member-img end -->
                    <div class="member-info">
                        <h5>{{$post->friendly}}</h5>
                        <h6>{{$post->enemy}}</h6>
                        <div class="divider--line divider--center"></div>
                        <p>{{ $post->weapon }}</p>

                        <button type="button" class="btn btn--primary btn--link" href="#" data-toggle="modal" data-target="#myModal" id="{{$post->id }}" onclick="showDtails">Get more weapon detials</button>

                    </div>


                </div>
                @endforeach

                <div id="myModal" class="modal fade" role="dialog">
                    <div class="modal-dialog">


                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal">&times;</button>
                                <h5 class="modal-title" id="myModalLable">{{$post->id}}</h5>
                            </div>
                            <div class="modal-body">
                                <img src="/app/assets/images/team/thumb/1.jpg">
                                <p>{{$post->full_weapon}}</p>
                            </div>

                        </div>

                    </div>
                </div>

            </div>



        </div>

推荐答案

HTML应该会这样

<div id="myModal" class="modal fade" role="dialog">
   <div class="modal-dialog">
      <div class="modal-content">
         <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal">&times;</button>
            <h5 class="modal-title" id="myModalLable">{{$post->id}}</h5>
         </div>
         <div class="modal-body">

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

按钮

<button type="button"  data-toggle="modal" data-target="#myModal" onclick="showDtails({{$post->id }})">Get more weapon detials</button>

带有ajax的调用功能

function showDtails(postid){
    $.ajax({
                url : '{{ route("getdata") }}',
                type: 'POST',
                headers: {
                    'X-CSRF-TOKEN': '{{ csrf_token() }}'
                },
                data:{postid:postid},
                success:function(data){

                    $('.modal-body').html(data)

                },

            });
}

Route.php

Route::post('/getdata', 'HomeController@getdata')->name('getdata');

Controller.php

Controller.php

public function getdata(Request $request){
    $postid = $request->postid;
    $post = Post::where('id',$postid)->first();
    return view('getdata',compact('post'));
}

getdata.blade.php 文件

<div>
    //whatever you write here or display here you'll get this data to your bootstrap model.
</div>

这篇关于如何通过使用Laravel以自举模式获取动态数据?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！