如何使用 Yajra Laravel 数据表搜索特定列

时间:2021-06-18 22:22:44

标签: laravel datatables

我有一个自定义过滤器,我想用它来搜索用户的角色。该角色正确返回,并且可以使用我现有的代码进行搜索。但是,如果搜索查询甚至部分匹配任何行中的其他内容,ajax 甚至会显示其他不相关的行。

我需要的是针对某一列进行查询。

这是我用来从下拉菜单中触发搜索的查询:

$("#users-list-role").on("change", function () {
    var usersRoleSelect = $("#users-list-role").val();       
    usersTable.columns(1).search(usersRoleSelect).draw();
  });

这是数据表:

var usersTable = $('#users_list_table').DataTable({
    columnDefs: [
        {
            targets: [0,1,2],
            className: 'center'
        }
    ],
    responsive: true,
    processing: true,
    serverSide: true,                    
    ajax: {
        url: formedURL,                              
    },
    columns: [
        {data: 'full_name', name: 'full_name'}, 
        {data: 'roles', name: 'roles.name'},
        {data: 'email', name: 'email'}, 
        {data: 'first_name', name: 'first_name', searchable: true, visible: false },
        {data: 'middle_name', name: 'middle_name', searchable: true, visible: false },
        {data: 'last_name', name: 'last_name', searchable: true, visible: false },          
    ],
    language: {
        "url": langURL
    },    
    initComplete:function( settings, json){
        $("#employeeTableCard").addClass("scale-in");       
    }

这是控制器中的 Ajax 调用:

public function listUsersData(Request $request)
{
    if(!$request->ajax())
        return Redirect::route('/');

    $users = User::with('roles'); 
   
    return DataTables::of($users)            
        ->addColumn('full_name', '{!!$first_name!!} {!!$middle_name!!} {!!$last_name!!}')
        ->addColumn('roles', function($users){ return $users->getRoleNames()->first(); })                       
        ->make(true);
}

1 个答案:

答案 0 :(得分:1)

好吧,再一次:这是一个简单的解决方案。

我只需要追加

export default function EmployeeProjects(props: any) {
  const [data, setData] = useState<EmployeeProject[]>([]);

  useEffect(() => {
    let employeeProjects: EmployeeProject[] = [];
    employeeProjects.push(new EmployeeProject(1, "React", "Frontend"));
    employeeProjects.push(new EmployeeProject(2, "Angular", "Frontend"));
    employeeProjects.push(new EmployeeProject(3, "Vue", "Frontend"));
    employeeProjects.push(new EmployeeProject(4, "Java", "Backend"));
    employeeProjects.push(new EmployeeProject(5, "C#", "Backend"));
    employeeProjects.push(new EmployeeProject(6, "Python", "Backend"));
    setData(employeeProjects);
  }, []);
  return (
    <div style={{ marginTop: "20px" }}>
      <DataGrid
        autoHeight={true}
        columns={[
          { field: "id", headerName: "ID", flex: 200 },
          { field: "projectName", headerName: "Project Name", flex: 200 },
          { field: "projectType", headerName: "Project Type", flex: 200 }
        ]}
        rows={data.filter(
          (employeeProject) =>
            employeeProject.projectName.includes(
              props.formik.values.projectName
            ) ||
            employeeProject.projectName.includes(
              props.formik.values.projectType
            )
        )}
      />
    </div>
  );
}

->select('users.*');

这解决了关系搜索,甚至是documented

$users = User::with('roles')