我正在使用laravel5.5 Ajax分页。当我单击第二页时,它将以JSON格式输出数据

时间:2018-09-08 05:33:25

标签: php laravel

我正在使用laravel5.5 Ajax分页。我是在控制器中组装的HTML部分。当我单击第二页时,我跳到了该方法。如何使已编译的HTML代码继续显示在页面上? 单击第二页后,将返回字符串JSON。这是个问题。我们如何才能使第二页上的数据继续显示在原始页上?

  

PHP

//Screen video, playback volume and key points.
public function accept(Request $ request){
    $id=$_GET['id']; 
    $summer=$_GET['key'];
    $name=DB::table('vd_category')->where('address',$summer)->value('name');
    if($id=='1'){
$video=DB::table('vd_video_'.$summer)->orderBy('state','desc')->paginate(25);
        }else if($id=='2'){
            $video=DB::table('vd_video_'.$summer)->orderBy('thumbs','desc')- 
>paginate(25);
        }
        $data='';
        foreach($video as $list){
            $data.='<div class="col-md-1-5 col-sm-4 col-xs-6" style="padding:0 
5px;"><div class="movie-item">';
            $data.="<a style='position:relative;display:block;' title='$list- 
>video_name' target='_blank' href='details?id=$list->id&key =$summer'>";
            $data.="<img alt='$list->video_name' title='$list->video_name' 
 src=\"uploads/$list->image_address\" height=\"230px\" width='100%'>";
            $data.="<button class='bdtag'></button>";
            $data.="</a>";
            $data.="<div class=\"meta\"><div 
style=\"width:100%;overflow:hidden;height:20px;\">";
            $data.="<a href='/details?id='$list->id'&key='$summer' 
target='_blank' title='$list->video_name' class=\"movie-name\">$list- 
>video_name</a>";
            $data.="<span class=\"otherinfo\"> 5.0分</span></div><div 
class=\"otherinfo\">类型:$name</div></div></div></div>";
        }
        $datav['1']=$data;
        $datav['2']="<div>"."{$video->appends(['id' => 
 $id,'key'=>$summer,'name'=>'page'])->links()}"."</div>";
        return json_encode($datav);
}
  

HTML

<div id="data">
    @foreach($video as $list)
        <div class="col-md-1-5 col-sm-4 col-xs-6" style="padding:0 5px;">
            <div class="movie-item">
                <a style="position:relative;display:block;" title="{{$list- 
     >video_name}}" target="_blank" href="/details?id={{$list->id}}&key= 
    {{$status}}">
                     <img alt="{{$list->video_name}}" title="{{$list- 
       >video_name}}" src="{{asset('uploads')}}/{{$list->image_address}}" 
    height="230" 
    width="100%">
                    <button class="bdtag"></button>
                </a>
                <div class="meta">
                    <div style="width:100%;overflow:hidden;height:20px;"><a 
    href="/details?id={{$list->id}}&key={{$status}}" target="_blank" title=" 
    {{$list- 
    >video_name}}" class="movie-name">{{$list->video_name}}</a><span 
     class="otherinfo"> 5.0分</span></div>
                    <div class="otherinfo">类型:{{$namme}}</div>
                </div>

            </div>
        </div>
    @endforeach
        </div>
    </div>
 </div>
<div id="datav" style="background:#FFF;padding-left:15px;">
{{$video->appends(['id' => $page,'name'=>'page'])->links()}}
</div>
  

JavaScript

<select name=""  required id="where_id" style="float: right;padding- 
    left:10px;border-left:8px;width: 90px;height: 30px;">
    <option value="">Click screening</option>
    <option value="1">Sort by play volume</option>
    <option value="2">Ranking by points</option>
    </select>
    <input type="hidden" id="summer" value="{{$status}}">
    <script type="text/javascript">
    $.ajaxSetup({
    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    }
    });
    $("#where_id").change(function () {
    var id=$("#where_id").val();
    var summer=$("#summer").val();

    $.ajax({
        type:"get",
        url:"accept",
        dataType:'json',
        data:{id:id,key:summer},
        success:function (event){
            $("#data").html(event[1]);
            $("#datav").html(event[2]);
        }
      });
     });
</script>

1 个答案:

答案 0 :(得分:0)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id='btnedit'>EDIT</button>
<button id='btnsave'>SAVE</button>

<div class='story' id='story'>
lorem ipsum
https://www.youtube.com/
lorem ipsum
https://www.google.com/
</div>