{"id":20738975,"url":"https://github.com/neoacevedo/laravel-gridview","last_synced_at":"2026-04-16T06:04:32.322Z","repository":{"id":218620215,"uuid":"746408665","full_name":"neoacevedo/laravel-gridview","owner":"neoacevedo","description":"Genera una tabla HTML con datos de array de Eloquent/Collections.","archived":false,"fork":false,"pushed_at":"2024-03-10T18:09:57.000Z","size":23595,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-07-25T23:41:35.440Z","etag":null,"topics":["gridview","html","laravel","table"],"latest_commit_sha":null,"homepage":"","language":"PHP","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"gpl-3.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/neoacevedo.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":".github/FUNDING.yml","license":"LICENSE.md","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"github":null,"patreon":null,"open_collective":null,"ko_fi":"neoacevedo","tidelift":null,"community_bridge":null,"liberapay":null,"issuehunt":null,"otechie":null,"lfx_crowdfunding":null,"custom":null}},"created_at":"2024-01-21T23:13:25.000Z","updated_at":"2024-03-10T17:59:39.000Z","dependencies_parsed_at":null,"dependency_job_id":"ab06e823-272a-49ad-9948-f58c97c93dee","html_url":"https://github.com/neoacevedo/laravel-gridview","commit_stats":null,"previous_names":["neoacevedo/laravel-gridview"],"tags_count":3,"template":false,"template_full_name":null,"purl":"pkg:github/neoacevedo/laravel-gridview","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/neoacevedo%2Flaravel-gridview","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/neoacevedo%2Flaravel-gridview/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/neoacevedo%2Flaravel-gridview/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/neoacevedo%2Flaravel-gridview/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/neoacevedo","download_url":"https://codeload.github.com/neoacevedo/laravel-gridview/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/neoacevedo%2Flaravel-gridview/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":27997440,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-12-24T02:00:07.193Z","response_time":83,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["gridview","html","laravel","table"],"created_at":"2024-11-17T06:22:11.220Z","updated_at":"2025-12-24T07:35:48.625Z","avatar_url":"https://github.com/neoacevedo.png","language":"PHP","funding_links":["https://ko-fi.com/neoacevedo"],"categories":[],"sub_categories":[],"readme":"Laravel GridView\n============\n\nLaravel GridView es un paquete para generar una tabla con datos. Permite generar de manera rápida una tabla a partir de un array de modelos Eloquent o Collections, usando los atributos como columnas y cada fila es un modelo con sus datos.\n\n## Instalación\n\nLa forma preferida de instalar esta extensión es a través de [composer](http://getcomposer.org/download/).\n\nLuego ejecute\n\n```\nphp composer.phar require --prefer-dist neoacevedo/laravel-gridview \"*\"\n```\n\no agregue\n\n```\n\"neoacevedo/laravel-gridview\": \"*\"\n```\n\na la sección require de su archivo `composer.json`.\n\n\nLuego ejecute el siguiente comando _artisan_ para copiar los assets en el directorio _public/vendor/gridview/assets_:\n\n```bash\nphp artisan vendor:publish --provider=\"neoacevedo\\\\gridview\\\\Providers\\\\GridViewServiceProvider\" --tag=gridview-assets\n```\n\n## Uso\n\nUna vez que la extensión está instalada, puede crear la tabla de la siguiente forma:\n\nRegistre el servico en el archivo de configuración _app.php_ en la sección `providers`:\n\n```php\n...\n/*\n * Package Service Providers...\n */\nneoacevedo\\gridview\\Providers\\GridViewServiceProvider::class,\n...\n```\n\nComo ejemplo, en su controlador, en el método index, puede poner lo siguiente:\n\n```php\npublic function index(Request $request, int $page = 1, int $perPage = 5)\n{\n\t$data = [\n\t\t[\n\t\t\t'nombre' =\u003e 'Andres',\n\t\t\t'fecha' =\u003e 1706200888,\n\t\t\t'email' =\u003e 'andres@localhost.com',\n\t\t],\n\t\t[\n\t\t\t'nombre' =\u003e 'Jorge',\n\t\t\t'fecha' =\u003e 1706200890,\n\t\t\t'email' =\u003e 'jorge@localhost.com',\n\t\t],\n\t\t[\n\t\t\t'nombre' =\u003e 'Nelson',\n\t\t\t'fecha' =\u003e 1706200990,\n\t\t\t'email' =\u003e 'nilson@localhost.com',\n\t\t],\n\t\t[\n\t\t\t'nombre' =\u003e 'Juan',\n\t\t\t'fecha' =\u003e 1706201000,\n\t\t\t'email' =\u003e 'juan@localhost.com',\n\t\t],\n\t\t[\n\t\t\t'nombre' =\u003e 'Pedro',\n\t\t\t'fecha' =\u003e 1706201010,\n\t\t\t'email' =\u003e 'pedro@localhost.com',\n\t\t],\n\t\t[\n\t\t\t'nombre' =\u003e 'Felipe',\n\t\t\t'fecha' =\u003e 1706201020,\n\t\t\t'email' =\u003e 'felipe@localhost.com',\n\t\t],\n\t\t[\n\t\t\t'nombre' =\u003e 'Fredy',\n\t\t\t'fecha' =\u003e 1706201030,\n\t\t\t'email' =\u003e 'fredy@localhost.com',\n\t\t],\n\t\t[\n\t\t\t'nombre' =\u003e 'Richard',\n\t\t\t'fecha' =\u003e 1706201040,\n\t\t\t'email' =\u003e 'richard@localhost.com',\n\t\t],\n\t];\n\n\tCollection::macro('paginate', function ($perPage, $total = null, $page = null, $pageName = 'page') {\n\t\t$page = $page ?: LengthAwarePaginator::resolveCurrentPage($pageName);\n\n\t\treturn new LengthAwarePaginator($this-\u003eforPage($page, $perPage), $total ?: $this-\u003ecount(), $perPage, $page, [\n\t\t\t'path' =\u003e LengthAwarePaginator::resolveCurrentPath(),\n\t\t\t'pageName' =\u003e $pageName,\n\t\t]);\n\t});\n\n\t$dataProvider = collect($data)-\u003epaginate(5);\n\treturn response()-\u003eview('index', compact('dataProvider'));\n}\n```\n\nPara Laravel 6.x o uso como clase:\n\n```php\n{{ gridview()-\u003ewidget([\n\t'dataProvider' =\u003e $dataProvider,\n\t'tableOptions' =\u003e [\n\t' id' =\u003e 'datatable',\n\t    'class' =\u003e 'dataTable'\n\t],\n\t'columns' =\u003e [\n\t\t[\n\t\t\t'attribute' =\u003e 'nombre',\n\t\t\t'headerOptions' =\u003e ['data-sortable' =\u003e 'true']\n\t\t],\n\t\t[\n\t\t\t'attribute' =\u003e 'fecha',\n\t\t\t'format' =\u003e ['datetime', 'd/m/Y H:i:s']\n\t\t],\n\t\t'email:email:Email',\n\t\t[\n\t\t\t'class' =\u003e '\\neoacevedo\\gridview\\Column\\ActionColumn',\n\t\t\t'header' =\u003e 'Actions'\n\t\t]\n\t]\n]) }}\n```\n\nPara Laravel \u003e=7.x, se puede de la forma anterior, o como componente:\n\n```php\n\u003cx-package-gridview id=\"table\" class=\"dataTable\"\n\t:dataProvider=\"$dataProvider\" :columns=\"[  \n\t\t\t[\n\t\t\t\t'attribute' =\u003e 'nombre',\n\t\t\t\t'headerOptions' =\u003e ['data-sortable' =\u003e 'true']\n\t\t\t],\n\t\t\t'fecha:datetime', // Formato corto del ejemplo anterior de la columna de fecha. \n\t\t\t'email:email:Email',\n\t\t\t[\n\t\t\t\t'class' =\u003e '\\neoacevedo\\gridview\\Column\\ActionColumn',\n\t\t\t\t'header' =\u003e 'Actions'\n\t\t\t]  \n\t]\" /\u003e\n```\n\nLa propiedad `dataProvider` tiene que ser de tipo `\\Illuminate\\Contracts\\Pagination\\LengthAwarePaginator` con el fin de generar el paginador.\n\nEn el array de columnas, puede especificar la clase que se encargará de renderizar el contenido de toda la columna a través de la propiedad `class`. Las clases de columna que soporta GridView son:\n\n- `\\neoacevedo\\gridview\\Column\\ActionColumn`: Columna que se encarga de renderizar botones para diferentes acciones sobre la fila.\n- `\\neoacevedo\\gridview\\Column\\CheckboxColumn`: Columna que se encarga de renderizar checkboxes.\n- `\\neoacevedo\\gridview\\Column\\DataColumn`: Columna que se encarga de renderizar la mayoría de los datos. Es la columna predefinida si se omite la propiedad `class`.\n- `\\neoacevedo\\gridview\\Column\\RadioButtonColumn`: Columna que se encarga de renderizar inputs de radio\n- `\\neoacevedo\\gridview\\Column\\SerialColumn`: Columna que renderiza el número de cada fila.\n\nCon cualquiera de las dos opciones, se obtendrá una tabla parecida a la siguiente:\n\n```html\n\u003ctable id=\"bootstrap-table\" class=\"table table-bordered table-hover\"\u003e\n    \u003cthead\u003e\n        \u003ctr\u003e\n            \u003cth data-field=\"0\"\u003e\n                \u003cdiv class=\"th-inner \"\u003e\u003cinput type=\"checkbox\" name=\"selection_all\" class=\"select-on-check-all\"\u003e\u003c/div\u003e\n                \u003cdiv class=\"fht-cell\"\u003e\u003c/div\u003e\n            \u003c/th\u003e\n            \u003cth data-field=\"1\"\u003e\n                \u003cdiv class=\"th-inner sortable both\"\u003eNombre\u003c/div\u003e\n                \u003cdiv class=\"fht-cell\"\u003e\u003c/div\u003e\n            \u003c/th\u003e\n            \u003cth data-field=\"2\"\u003e\n                \u003cdiv class=\"th-inner \"\u003eFecha\u003c/div\u003e\n                \u003cdiv class=\"fht-cell\"\u003e\u003c/div\u003e\n            \u003c/th\u003e\n            \u003cth data-field=\"3\"\u003e\n                \u003cdiv class=\"th-inner \"\u003eEmail\u003c/div\u003e\n                \u003cdiv class=\"fht-cell\"\u003e\u003c/div\u003e\n            \u003c/th\u003e\n            \u003cth class=\"text-center\" data-field=\"4\"\u003e\n                \u003cdiv class=\"th-inner \"\u003eActions\u003c/div\u003e\n                \u003cdiv class=\"fht-cell\"\u003e\u003c/div\u003e\n            \u003c/th\u003e\n        \u003c/tr\u003e\n    \u003c/thead\u003e\n    \u003ctbody\u003e\n        \u003ctr data-index=\"0\" data-key=\"0\"\u003e\n            \u003ctd\u003e\u003cinput type=\"checkbox\" value=\"0\" class=\"form-check-input\" name=\"selection[]\"\u003e\u003c/td\u003e\n            \u003ctd\u003eAndres\u003c/td\u003e\n            \u003ctd\u003e2024-01-25 16:41:28\u003c/td\u003e\n            \u003ctd\u003e\u003ca href=\"mailto:andres@localhost.com\"\u003eandres@localhost.com\u003c/a\u003e\u003c/td\u003e\n            \u003ctd class=\"text-center\"\u003e\u003ca href=\"http://localhost:8090/controller/view?id=0\" title=\"messages.view\"\n                    aria-label=\"messages.view\"\u003e\u003csvg aria-hidden=\"true\"\n                        style=\"display:inline-block;font-size:inherit;height:1em;overflow:visible;vertical-align:-.125em;width:1.125em\"\n                        xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 576 512\"\u003e\n                        \u003cpath fill=\"currentColor\"\n                            d=\"M573 241C518 136 411 64 288 64S58 136 3 241a32 32 0 000 30c55 105 162 177 285 177s230-72 285-177a32 32 0 000-30zM288 400a144 144 0 11144-144 144 144 0 01-144 144zm0-240a95 95 0 00-25 4 48 48 0 01-67 67 96 96 0 1092-71z\"\u003e\n                        \u003c/path\u003e\n                    \u003c/svg\u003e\u003c/a\u003e \u003ca href=\"http://localhost:8090/controller/edit?id=0\" title=\"messages.edit\"\n                    aria-label=\"messages.edit\"\u003e\u003csvg aria-hidden=\"true\"\n                        style=\"display:inline-block;font-size:inherit;height:1em;overflow:visible;vertical-align:-.125em;width:1em\"\n                        xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"\u003e\n                        \u003cpath fill=\"currentColor\"\n                            d=\"M498 142l-46 46c-5 5-13 5-17 0L324 77c-5-5-5-12 0-17l46-46c19-19 49-19 68 0l60 60c19 19 19 49 0 68zm-214-42L22 362 0 484c-3 16 12 30 28 28l122-22 262-262c5-5 5-13 0-17L301 100c-4-5-12-5-17 0zM124 340c-5-6-5-14 0-20l154-154c6-5 14-5 20 0s5 14 0 20L144 340c-6 5-14 5-20 0zm-36 84h48v36l-64 12-32-31 12-65h36v48z\"\u003e\n                        \u003c/path\u003e\n                    \u003c/svg\u003e\u003c/a\u003e \u003ca href=\"http://localhost:8090/controller/delete?id=0\" title=\"messages.delete\"\n                    aria-label=\"messages.delete\" data-confirm=\"messages.delete_confirm\" data-method=\"post\"\u003e\u003csvg\n                        aria-hidden=\"true\"\n                        style=\"display:inline-block;font-size:inherit;height:1em;overflow:visible;vertical-align:-.125em;width:.875em\"\n                        xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 448 512\"\u003e\n                        \u003cpath fill=\"currentColor\"\n                            d=\"M32 464a48 48 0 0048 48h288a48 48 0 0048-48V128H32zm272-256a16 16 0 0132 0v224a16 16 0 01-32 0zm-96 0a16 16 0 0132 0v224a16 16 0 01-32 0zm-96 0a16 16 0 0132 0v224a16 16 0 01-32 0zM432 32H312l-9-19a24 24 0 00-22-13H167a24 24 0 00-22 13l-9 19H16A16 16 0 000 48v32a16 16 0 0016 16h416a16 16 0 0016-16V48a16 16 0 00-16-16z\"\u003e\n                        \u003c/path\u003e\n                    \u003c/svg\u003e\u003c/a\u003e\u003c/td\u003e\n        \u003c/tr\u003e\n        \u003ctr data-index=\"1\" data-key=\"1\"\u003e\n            \u003ctd\u003e\u003cinput type=\"checkbox\" value=\"1\" class=\"form-check-input\" name=\"selection[]\"\u003e\u003c/td\u003e\n            \u003ctd\u003eJorge\u003c/td\u003e\n            \u003ctd\u003e2024-01-25 16:41:30\u003c/td\u003e\n            \u003ctd\u003e\u003ca href=\"mailto:jorge@localhost.com\"\u003ejorge@localhost.com\u003c/a\u003e\u003c/td\u003e\n            \u003ctd class=\"text-center\"\u003e\u003ca href=\"http://localhost:8090/controller/view?id=1\" title=\"messages.view\"\n                    aria-label=\"messages.view\"\u003e\u003csvg aria-hidden=\"true\"\n                        style=\"display:inline-block;font-size:inherit;height:1em;overflow:visible;vertical-align:-.125em;width:1.125em\"\n                        xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 576 512\"\u003e\n                        \u003cpath fill=\"currentColor\"\n                            d=\"M573 241C518 136 411 64 288 64S58 136 3 241a32 32 0 000 30c55 105 162 177 285 177s230-72 285-177a32 32 0 000-30zM288 400a144 144 0 11144-144 144 144 0 01-144 144zm0-240a95 95 0 00-25 4 48 48 0 01-67 67 96 96 0 1092-71z\"\u003e\n                        \u003c/path\u003e\n                    \u003c/svg\u003e\u003c/a\u003e \u003ca href=\"http://localhost:8090/controller/edit?id=1\" title=\"messages.edit\"\n                    aria-label=\"messages.edit\"\u003e\u003csvg aria-hidden=\"true\"\n                        style=\"display:inline-block;font-size:inherit;height:1em;overflow:visible;vertical-align:-.125em;width:1em\"\n                        xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"\u003e\n                        \u003cpath fill=\"currentColor\"\n                            d=\"M498 142l-46 46c-5 5-13 5-17 0L324 77c-5-5-5-12 0-17l46-46c19-19 49-19 68 0l60 60c19 19 19 49 0 68zm-214-42L22 362 0 484c-3 16 12 30 28 28l122-22 262-262c5-5 5-13 0-17L301 100c-4-5-12-5-17 0zM124 340c-5-6-5-14 0-20l154-154c6-5 14-5 20 0s5 14 0 20L144 340c-6 5-14 5-20 0zm-36 84h48v36l-64 12-32-31 12-65h36v48z\"\u003e\n                        \u003c/path\u003e\n                    \u003c/svg\u003e\u003c/a\u003e \u003ca href=\"http://localhost:8090/controller/delete?id=1\" title=\"messages.delete\"\n                    aria-label=\"messages.delete\" data-confirm=\"messages.delete_confirm\" data-method=\"post\"\u003e\u003csvg\n                        aria-hidden=\"true\"\n                        style=\"display:inline-block;font-size:inherit;height:1em;overflow:visible;vertical-align:-.125em;width:.875em\"\n                        xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 448 512\"\u003e\n                        \u003cpath fill=\"currentColor\"\n                            d=\"M32 464a48 48 0 0048 48h288a48 48 0 0048-48V128H32zm272-256a16 16 0 0132 0v224a16 16 0 01-32 0zm-96 0a16 16 0 0132 0v224a16 16 0 01-32 0zm-96 0a16 16 0 0132 0v224a16 16 0 01-32 0zM432 32H312l-9-19a24 24 0 00-22-13H167a24 24 0 00-22 13l-9 19H16A16 16 0 000 48v32a16 16 0 0016 16h416a16 16 0 0016-16V48a16 16 0 00-16-16z\"\u003e\n                        \u003c/path\u003e\n                    \u003c/svg\u003e\u003c/a\u003e\u003c/td\u003e\n        \u003c/tr\u003e\n    \u003c/tbody\u003e\n\u003c/table\u003e\n```\n\n### Sobrescribir la plantilla `Blade`\n\nSi desea sobrescribir la vista que genera la tabla, ejecute el siguiente comando para que copie los archivos de vista en \n_resources/views/vendor/gridview_:\n\n```bash\nphp artisan vendor:publish --provider=\"neoacevedo\\\\gridview\\\\Providers\\\\GridViewServiceProvider\" --tag=gridview-view\n```\n\nSi está usando GridView como componente, la vista será copiada en _resources/views/components_:\n\n```bash\nphp artisan vendor:publish --provider=\"neoacevedo\\\\gridview\\\\Providers\\\\GridViewServiceProvider\" --tag=gridview-component-view\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fneoacevedo%2Flaravel-gridview","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fneoacevedo%2Flaravel-gridview","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fneoacevedo%2Flaravel-gridview/lists"}