Question

我正在尝试使用ajax在面板中搜索用户。但是与此同时，我也想编辑所选的用户。

我已经在控制器内部创建了按钮来实现此目的，但是该按钮不起作用。

这是我的控制器代码：

public function searchTeacher(Request $request){
if($request->ajax()){
    $output = '';
    $query = $request->get('query');
    if($query != '')
    {
        $data = DB::table('users')->where('name', $query)->get();
    }else{
        $data = DB::table('users')->get();
    }
    $total_row = $data->count();
    if($total_row > 0)
    {
        foreach($data as $row)
        {
            $output .= '
            <tr>
            <td>'.$row->name.'</td>
            <td>'.$row->email.'</td>
            <td>'.$row->teacherId.'</td>
            <td>'.$row->subject.'</td>
            <td> <button href={{route(update-teacher-view), '.$row->id.'}}> Edit</button> </td>
            </tr>
            ';
        }
    }
    else
    {
        $output = '
        <tr>
        <td align="center" colspan="5">No Data Found</td>
        </tr>
        ';
    }
    $data = array(
        'table_data'  => $output,
        'total_data'  => $total_row
    );

    echo json_encode($data);
}
}

这是搜索方法的ajax-

<script>
$(document).ready(function(){

    fetch_customer_data();

    function fetch_customer_data(query = '')
    {
        console.log(query)
        $.ajax({
            url:"{{ route('search-teacher') }}",
            method:'GET',
            data:{query:query},
            dataType:'json',
            success:function(data)
            {
                $('tbody').html(data.table_data);
                $('#total_records').text(data.total_data);
            }
        })
    }

    $(document).on('keyup', '#search', function(){
        var query = $(this).val();
        fetch_customer_data(query);
    });
});

这是我的html-

<section class="panel">
            <table class="table table-striped">
                <thead class="team-list chat-list-side info border-less-list">
                    <th>Teacher Name</th>
                    <th>Email</th>
                    <th>Teacher Id</th>
                    <th>Subject</th>
                </thead>

                <tbody>
                </tbody>
                </table>
            </section>

将不胜感激。

先谢谢了。

Answer 1

也许是错误的字符串插值？应该是这样的：

<?php
$output .= '
    <tr>
    <td>'.$row->name.'</td>
    <td>'.$row->email.'</td>
    <td>'.$row->teacherId.'</td>
    <td>'.$row->subject.'</td>
    <td> <button href='.route('update-teacher-view', $row->id).'> Edit</button> </td>
    </tr>
    ';

也将返回值，而不是echo-，它将自动转换为JSON响应：

// echo json_encode($data); // Change this line to below
return $data;

Answer 2

使用数据呈现刀片文件是最好的解决方案。

在控制器中

return View::make('ajaxFilter',compact('data'))->render();

在 ajaxFilter.blade.php

<section class="panel">
    <table class="table table-striped">
        <thead class="team-list chat-list-side info border-less-list">
            <th>Teacher Name</th>
            <th>Email</th>
            <th>Teacher Id</th>
            <th>Subject</th>
        </thead>
        <tbody>
            @if($data->count() > 0)
                @foreach($data as $row)
                    <tr>
                        <td>{{ $row->name }}</td>
                        <td>{{ $row->email }}</td>
                        <td>{{ $row->teacherId }}</td>
                        <td>{{ $row->subject }}</td>
                        <td>
                            <a href="{{ route('update-teacher-view',$row->id) }}">Edit</a> //button design
                        </td>
                    </tr>
                @endforeach
            @else
                No data Found
            @endif
        </tbody>
    </table>
</section>

在ajax响应上，您可以添加类似这样的HTML数据

$('#div_or_section_id').html(data);

使用控制器内的按钮

2 个答案: