Laravel模板中使用Ajax、layer,layui数据表格(检索)

1、Laravel模板中使用Ajax

                   $.ajax({
                       url:"",
                       type:"",
                       data:{},
                       success:function () {
 
                           var obj = JSON.parse(data);
 
                       }
                    });

#  <meta name="_token" content="{{ csrf_token() }}"/>

#    headers: {
                    'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
            },

2、Layui数据表格接口

//搜索前端html
 
       <fieldset class="table-search-fieldset">
            <legend>搜索信息</legend>
            <div style="margin: 10px 10px 10px 10px">
                <form class="layui-form layui-form-pane" action="">
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label">用户id</label>
                            <div class="layui-input-inline">
                                <input type="text" name="id" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">用户昵称</label>
                            <div class="layui-input-inline">
                                <input type="text" name="name" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">手机号</label>
                            <div class="layui-input-inline">
                                <input type="text" name="phone" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <label class="layui-form-label">appid</label>
                            <div class="layui-input-inline">
                                <input type="text" name="appid" autocomplete="off" class="layui-input">
                            </div>
                        </div>
                        <div class="layui-inline">
                            <button type="submit" class="layui-btn layui-btn-primary"  lay-submit lay-filter="data-search-btn"><i class="layui-icon"></i> 搜 索</button>
                        </div>
                    </div>
                </form>
            </div>
        </fieldset>
 
 

　　

//js代码
<script>
layui.use(['table','form'], function(){
   //****
    var $ = layui.jquery,
    form = layui.form,
    table = layui.table;
    //****
            
  table.render({
    elem: '#test'
    ,url:'/admin/user/data'
    ,toolbar: '#toolbar'
   
    ,title: '用户数据表'
    ,totalRow: true
      ,limit:30
        ,parseData: function(res) { //res 即为原始返回的数据
            return {
                "code":'0', //解析接口状态
                "msg": res.message, //解析提示文本
                "count":res.total, //解析数据长度
                "data": res.data //解析数据列表
            }
        }
    ,cols: [[
      {field:'id', title:'id', width:80, fixed: true, unresize: true, sort: true, totalRowText: '合计行'}
      ,{field:'name', title:'用户名', width:150, }
      ,{field:'phone', title:'手机号', width:200, }
      ,{field:'money', title:'余额', edit: 'text', width:100,sort:true, templet:'#money'}
      ,{field:'huilv', title:'汇率', width:70, edit: 'text', templet:'#huilv'}
      ,{field:'created_at', title:'注册时间', width:200, sort: true, }
      ,{field:'updated_at', title:'更新时间' ,width:200, sort: true,}
      ,{field:'status', title:'禁用/开启', width:100, templet: '#status',}
       ,{field:'pay_status', title:'批量代付', width:100, templet: '#status2',}
        ,{field:'api_status', title:'api权限', width:100, templet: '#status3',}
        ,{field:'appid', title:'appid', width:200 }
         ,{field:'appsecret', title:'密钥', width:300,templet:function(d){
             
             if(d.appsecret==null){
                 return "暂未生成";
             }else{
                 
                 return d.appsecret;
             }
         }}
       ,{field:'right', title:'操作', templet: '#caozuo',}
    ]]
    ,page: true
    ,id: 'testReload'
 
 
  });
  
 
 
   // 监听搜索操作
        form.on('submit(data-search-btn)', function (data) {
            var result = JSON.stringify(data.field);
            layer.alert(result, {
                title: '最终的搜索信息'
            });
            
            // console.log(result);
 
            //执行搜索重载
            table.reload('testReload', {
                page: {
                    curr: 1
                }
                , where: {
                    searchParams: result
                }
            }, 'data');
 
            return false;
        });
 
  
  
});
 
 
</script>

//后台接口
    public  function user_data(Request $request){
 
       $limit = $request->get('limit');
       $data = $request->get('searchParams');
       $data = json_decode($data,true);
 
 
       if($data!=null){
              
              
              if($data['id']!=null){
                  
                  $getDB = DB::table('users')->where('id',$data['id']);
                  
              }
              
               if($data['name']!=null){
                  
                  $getDB = DB::table('users')->where('name',$data['name']);
                  
              }
              
               if($data['phone']!=null){
                  
                  $getDB = DB::table('users')->where('phone',$data['phone']);
                  
              }
              
               if($data['appid']!=null){
                  
                  $getDB = DB::table('users')->where('appid',$data['appid']);
                  
              }
              
              
              $data = $getDB->paginate($limit);
              
              
              
          }else{
              
              
              $data = DB::table('users')->orderBy('created_at','desc')->paginate($limit);
              
          }
         
        
 
 
 
          return $user_data;
 
 
    }