datatable, realizar en el campo columns, un hipervínculo con una ruta de laravel que pasa un parametro

Question

Buen día, tengo un problema que he estado buscando una solución, estoy pasando un dataTable que se inicializa porla vista del cliente, con el metodo de ajax para cargar todo por el lado del servidor, hasta ahora fue facil, ya consegui recuperar todos los datos que necesito, pero en la dataTable que no usaba ajax, tenía un hipervínculo que pasaba un parametro para ingresar a otra vista, pero ahora cuando creo el hipervínculo funciona bien, pero el parametro me toma como un string en vez que recupere el valor que le quiero pasar.

paso el código de como realizo el proceso de creación del hipervínculo en columns:

$(document).ready(function(){
            $('#usuarios').DataTable(
            {
                // processing: true,
                serverSide:true,
                responsive: true,
                ajax: "{{route('dataTable', $procesoElegido)}}",
                dataType: 'json',
            "columns":[
                {data: 'proceso.user_proceso.Matricula'},
                // {data: 'proceso.user_proceso.alumno_perfil_user.Nombre'},
                {
                data: null,
                render: function (data, type, row) 
                    {


            return '<a href="{{ route('progresoDocumentacion','$id=data.proceso.IdProceso')}}">' + data.proceso.user_proceso.alumno_perfil_user.Nombre + ' ' + data.proceso.user_proceso.alumno_perfil_user.APP + ' ' + data.proceso.user_proceso.alumno_perfil_user.APM + '</a>';

                    }
                }, 

en el segundo dato de columns me da el error, en especifico en el href, cuando trato de pasar la variable, lo he intentado de varias manera, al principio pense que estaba utilizando mal las comillas simples y dobles, pero aun asi me sigue saliendo error, cuando ingreso al hipervínculo, la url sale de la siguiente manera:

"http: // 127.0.0.1: 8000/ procesoUsuario/%24id=data.proceso.IdProceso"

Cuando en realidad deberia estar pasando un valor numerico que trato de pasar por medio de data.proceso.IdProceso.

Bueno tal vez sea algo mas facil de realizar y por falta de conocimiento no lo he observado o detectado, espero alguien me pueda ayudar, gracias.

Answer 1

Al final pase por el servidor el boton. de la siguiente manera..

    return datatables()->of($procesosAsignadosAnteriores)
    ->addColumn('actions', function($procesosAsignadosAnteriores) {
        return '<a href="/procesoUsuario/'.$procesosAsignadosAnteriores->proceso->IdProceso.'" ><i></i> '.$procesosAsignadosAnteriores->proceso->user_proceso->alumno_perfil_user->Nombre.''.$procesosAsignadosAnteriores->proceso->user_proceso->alumno_perfil_user->APP.''.$procesosAsignadosAnteriores->proceso->user_proceso->alumno_perfil_user->APM.'</a>';
    })
    ->rawColumns(['actions'])
    ->toJson();

Aun que esto me genera alguna dudas, ya que el link que me genera es el siguiente:

aqui "< a href="/procesoUsuario/58" >"

aun no se si esto servira si esta en producción, pero en local funciona.

Answer 2

En lo personal hago lo siguiente: del lado del servidor intento agregar al json que espera Datatables la mayor cantidad de data necesaria para la renderización del mismo, y dejo para el cliente la conformación de la tabla, incluyendo el diseño, estilo de los botones y por supuesto el binding a los posibles eventos sobre esos botones (estén ubicados en las filas del Datatables, o botones de acciones más generales).

Durante la iteración por la data obtenida desde la base de datos y la consiguiente conformación del json que espera Datatables, por ejemplo:

public function DTEmbarazada(Request $request):JsonResponse{
// $params from request object...
// $resultado = get resultset based on request params....   
$data = [];                    
                    foreach ($resultado['results'] as $embarazada) {
                        $data[] = [                           
                            'DT_RowId' =>  $uuidEncoder->encode($embarazada->getIdPublico()),
                            'nombre' => [
                                'nombre' => $embarazada->getNombre(),
                                'src' => $this->generateUrl('embarazada_hoja_resumen', ['id' => $uuidEncoder->encode($embarazada->getIdPublico())])
                             ],                                
                            'edad' => $embarazada->getEdad(),
                            'fum' => $embarazada->getFechaUltimaMenstruacion()->format('d/m/Y'),
                            
                            'editar_link' => [
                                'src' => $this->generateUrl('embarazadas_editar', ['id' => $uuidEncoder->encode($embarazada->getIdPublico())]),
                                'enabled' => ($this->isGranted('EMBARAZADA_EDITAR', $embarazada) === true) ? true : false
                            ],                            
                            'eliminar_link' => [
                                'src' => $this->generateUrl('embarazadas_eliminar', ['id' => $uuidEncoder->encode($embarazada->getIdPublico())]),
                                'enabled' => ($this->isGranted('EMBARAZADA_ELIMINAR', $embarazada) === true) ? true : false
                            ],
                        ];                        
                    }
                    $dataRespuesta = [
                        'draw' => (int) $draw,
                        'recordsTotal' => \intval($resultado['totalResults']),
                        'recordsFiltered' => \intval($resultado['countResults']),
                        'data' => $data
                    ];
    
                    return new JsonResponse($dataRespuesta);
}

Y del lado de cliente, por ejemplo en el render de la columna correspondiente a nombre:

    {
        "name": "nombre",                            
        "render": function (data, type, full) {                                
              return '<a href="' + data.src + '">' + data.nombre + '</a>';
         }
   },