Quiero tener una tabla básica que cambie el contenido dinámicamente cuando el usuario seleccione una empresa diferente de un menú desplegable. La tabla solo cargará los datos de la empresa seleccionada únicamente y vía AJAX. A la tabla también se le aplicarán algunos filtros, como el filtro de nombre de departamento, y me encantaría mantener esa funcionalidad, así como el enlace de paginación que utiliza los enlaces integrados de Laravel. Aquí hay un fragmento de código que tengo.
Tabla HTML
<table class="min-w-full divide-y divide-gray-200"> <thead class="bg-gray-50"> <tr> <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-black uppercase tracking-wider"> No. </th> <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-black uppercase tracking-wider"> Form Enquiry Name </th> </thead> <tbody class="bg-white divide-y divide-gray-200"> @forelse ($data as $item) <tr> <td class="px-6 py-4 whitespace-nowrap"> <div class="text-sm text-gray-900">{{ $data->firstItem() + $loop->index }}.</div> </td> <td class="px-6 py-4 whitespace-nowrap"> <div class="flex items-center"> <div class="text-sm font-medium text-gray-900"> ID #{{ $item->id }} </div> </div> <span class="inline-flex text-xs leading-5 font-semibold rounded-full text-gray-500"> {{ $item->name }} </span> </td> </tr> </tbody>
Controlador
public function index(Request $request) { $company= $request->Company; $data = FormEnquiry::orderByDesc('created_at') ->where('name', 'LIKE', "%{$company}%") ->where('created_by', Auth::user()->id) ->simplePaginate(5); return view('form.form-enquiry.index', ['data'=>$data, 'formName'=>$request->formName, 'deptId'=>$request->deptId, 'company'=>$company]); }
¿Puedo saber cuál es la mejor manera de hacer que la tabla cargue datos dinámicamente cuando el menú desplegable de la empresa se selecciona de manera diferente? ¿Y cómo me aseguraría de que la paginación no se rompa, si es que hay alguna, y aún pueda hacer el filtro de funcionalidad de búsqueda?
Mueva su tabla y paginación a un archivo separado (incluida la paginación) como views/partials/table.blade.php
Luego, en el método de sus controladores para la llamada ajax, cree un HTML real y devuélvalo a AJAX:
$html = view('partials.table', compact('data'))->render(); return response()->json(['html' => $html]);
Y el paso final es reemplazar el HTML actual con datos de respuesta que obtendrá en la devolución de llamada exitosa de AJAX.