Laravel 5.7 Ascending & Descending with Jquery - PullRequest
0 голосов
/ 08 ноября 2018

Я новичок в Laravel. В своей таблице я применил поиск в реальном времени и по возрастанию и убыванию столбца с помощью Jquery. Я смотрю какое-то руководство по упорядочению по возрастанию и убыванию, но в этом видео он использует собственный PHP.

Я почти закончил, мой порядок убывания работает, но когда он теперь находится в порядке возрастания, у меня возникла проблема.

Когда я щелкну по столбцу «Имя», он будет отсортирован по убыванию, что является правильным, но когда я щелкну по нему еще раз, мой jquery не получит ответа

Вопрос: почему мой JQuery не работает, когда он находится в восходящем?

View

<!-- Will be used to replace the data-sort -->
<div class="table-responsive" id="staff_table">
    <table class="table table-bordered table-hover" id="table">
        <thead>
            <tr>
                <th>ID </th>
                <th><a class="column_sort" data-user="staff" data-table="staff" data-sort="desc" id="name" href="#">Name</a> </th>
                <th><a class="column_sort" data-user="staff" data-table="staff"data-sort="desc" id="username" href="#">Username</th>
                    <th><a class="column_sort" data-user="staff" data-table="staff"data-sort="desc" id="email" href="#">Email</th>
                        <th>Date Created</th>
                        <th>Time Created</th>
                        <th>Status</th>
            </tr>
        </thead>
        <tbody>
            @foreach($staffs as $staff)

            <tr>
                <td>{{ $staff->id }}</td>
                <td>{{ $staff->name }}</td>
                <td>{{ $staff->username }}</td>
                <td>{{ $staff->email}}</td>
                <td>{{ date('F m, o', strtotime($staff->created_at)) }}</td>
                <td>{{ date('H:i A', strtotime($staff->created_at)) }}</td>
                <td>{{ "TEMP" }}</td>
            </tr>

            @endforeach
        </tbody>

            </table>

        </div>

Javascript

$(document).ready(function(){
    $('.column_sort').on('click',function () {
        var column_name = $(this).attr("id");
        var sort = $(this).data("sort");
        var user = $(this).data("user");
        var table = $(this).data("table");
        var arrow = "";
        if(sort == 'desc')
        {
            arrow = '<i class="fas fa-sort-up style=float:right;"></i>'

        }
        else
        {   
            arrow = '<i class="fas fa-sort-down style=float:right;"></i>'

        }
        $.ajax({
        type : 'get',
        url : '{{URL::to('sort')}}',
        data:{'column_name':column_name,sort:sort,user:user,table:table},
        success:function(data)
        {

            $('#staff_table').html(data);
            $('#'+column_name+'').append(arrow);
        },

        });
    // order = $(this).data("order","asc");
    });
});

Контроллер

public function sort(Request $request)
{

    if($request->ajax())
    {
        $output=""; 
        $sort = $request->sort;
        // Check the sort if it is desc or ascending

        if($sort == "desc")
        {
            // True it will be sort by descending
            $staffs = DB::table($request->table)
                                    ->orderBy($request->column_name, $request->sort)
                                    ->get();
            // Then re-assign the $sort to ascending
            $sort = "asc";
        }
        else
        {
            // True it will be sort by ascending
            $staffs = DB::table($request->table)
                                    ->orderBy($request->column_name, $request->sort)
                                    ->get();
            // Then re-assign the $sort to descending
            $sort = "desc";
        }
            $output .='<table class="table table-bordered table-hover" id="table">'.
                    '<thead>'.
                        '<tr>'.
                            '<th>ID </th>'.
                            '<th><a class="column_sort" data-user="'.$request->user.'" data-table="'.$request->table.'" data-sort="'.$sort.'" id="name" href="#">Name</a> </th>'.
                            '<th><a class="column_sort" data-user="'.$request->user.'" data-table="'.$request->table.'"data-sort="'.$sort.'" id="username" href="#">Username</th>'.
                            '<th><a class="column_sort" data-user="'.$request->user.'" data-table="'.$request->table.'"data-sort="'.$sort.'" id="email" href="#">Email</th>'.
                            '<th>Date Created</th>'.
                            '<th>Time Created</th>'.
                            '<th>Status</th>'.

                        '</tr>'.

                    '</thead>';

            foreach ($staffs as $key => $staff) 
            {
                $output.='<tr>'.
                '<td>'.$staff->id.'</td>'.
                '<td>'.$staff->name.'</td>'.
                '<td>'.$staff->username.'</td>'.
                '<td>'.$staff->email.'</td>'.
                '<td>'.date('F m, o', strtotime($staff->created_at)).'</td>'.
                '<td>'.date('H:i A', strtotime($staff->created_at)).'</td>'.
                '</tr>';
            }
            $output .='</table>';
            return Response($output);           
    }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...