如何在单击按钮时过滤数据并在不重新加载页面的情况下显示在同一选项卡上

时间:2019-06-05 09:55:52

标签: javascript ajax laravel button filter

我有三个标签。在一个我想从数据库中加载数据,并通过电子邮件进行过滤。当我单击按钮时,我只希望在同一选项卡的表中显示带有电子邮件的用户的数据。

这是我的脚本

<script>
    jQuery('.savedata').click(function (e) {
        e.preventDefault();

        jQuery.post('/gettabdata', {
            _token: window.csrf_token,
            email: jQuery('input[name="email"]').val()
        } 
        function (data) {
            var $tableBody = jQuery('#filtered-data tbody');
            $tableBody.html('');

            jQuery.each(data, function (i) {
                $tableBody.append(
                    '<tr>' +
                        '<td>' + data[i].User_id + '</td>' +
                        '<td>' + data[i].email + '</td>' +
                        '<td>' + data[i].status + '</td>' +
                        '<td>' + data[i].date + '</td>' +
                        '<td>' + data[i].time + '</td>' +

                    '</tr>'
                ); 
            });
        }

        'json');
    });
</script> 

这是我的控制器 我想在其中查看结果的标签 其他{

        $user = \Auth::guard('api')->user();
        $post = $request->all();
        $email = $request->input('email');
        $cond = ' 1=1 ';
        if(!empty($post['email'])){
        $cond .= " and email like '".$post['email']."'";
        }
        $qry = 'SELECT User_id, email, status, date, time FROM profile WHERE  '.$cond.' ';
        $data = DB::select($qry);


        $response = $this->analysis($post);
        //$getdata=$this->userdata($post);

        $data = [
        'data'=>$data,
        'response'=>$response,
        //'getdata'=>$getdata

        ];

            return response()->json($data);


    }

1 个答案:

答案 0 :(得分:1)

尝试

Route
Route::get('/get-record-by-email','Controller@getRecord');


//controller
    public function getRecord(Request $request)
    {
    $emailid= Input::get('email_id');

    $jsondata= DB::table(your-table)->where('email',$emailid)->get();
    return response()->json($jsondata);

    }


    //Ajax call
    $("#btnClick").change(function(e){

            //console.log(e);
            var email_id = e.target.value;

            //alert(email_id);
            //$token = $("input[name='_token']").val();
            //ajax
            $.get('/get-record-by-email?email_id='+email_id, function(data){
            $('#filterdata').empty();
            //console.log(data);
            $.each(data, function(index, obj){
            $('#filterdata').append( '<tr>'

                                          '<td>' + obj.User_id + '</td>' +
                                          '<td>' + obj.email + '</td>' +
                                          '<td>' + obj.status + '</td>' +
                                          '<td>' + obj.date + '</td>' +
                                          '<td>' + obj.time + '</td>' +

                                      '</tr>' );
              });
            })
        });