Comments (1)
JIG is built on top of datatables.net and is fully server-side rendered using Yajra Datatables. Most of the logic resides inside App\Repositories
and in the respective Repository file, there is a method called dtColumns
which is used to fully control the columns shown in the Index page.
For example, in order to control the columns shown for the Users Datatable, the following is the dtColumns
method under App\Repositories\Users.php
:
public static function dtColumns(): array
{
return [
Column::make('id')->title('ID')->className('all text-right'),
Column::make("name")->className('all'),
Column::make("first_name")->className('none'),
Column::make("last_name")->className('none'),
Column::make("middle_name")->className('none'),
Column::make("username")->className('min-desktop-lg'),
Column::make("email")->className('min-desktop-lg'),
Column::make("gender")->className('min-desktop-lg'),
Column::make("dob")->className('none'),
//Column::make("email_verified_at")->className('min-desktop-lg'),
Column::make("activated")->className('min-desktop-lg'),
Column::make("created_at")->className('min-tv'),
Column::make("updated_at")->className('min-tv'),
Column::make('actions')->className('min-desktop text-right')->orderable(false)->searchable(false),
];
}
NOTE: In order to omit the email_verified_at
class from my Index columns all I had to do is comment it out (or better yet, just remove it from the list of columns!)
The datatables are also responsive by default (Checkout https://datatables.net/extensions/responsive/ for more details). For this purpose, you can use one of the following jig-provided responsive breakpoints to automatically collapse the column below a given screen size. For info on how to use the class logic, checkout the Class Logic Documentation. Most of the time I only use min-
, e.g min-desktop-l
breakpoints: [
{ name: "tv", width: Infinity },
{ name: "desktop-l", width: 1536 },
{ name: "desktop", width: 1280 },
{ name: "tablet-l", width: 1024 },
{ name: "tablet-p", width: 768 },
{ name: "mobile-l", width: 480 },
{ name: "mobile-p", width: 320 },
],
}
Checkout the first snippet on how I have used the responsive classes!
@clawes I hope this helps. I have added it to the documentation milestone, in which I intend to write more detailed documentation to guide in cases like these.
from jetstream-inertia-generator.
Related Issues (20)
- PHP 8 HOT 1
- Making this works with inertia team. HOT 2
- Error after fresh installation - Laravel 8 HOT 4
- Cant install vue-select HOT 3
- Missing dependencies HOT 1
- InfiniteSelect Error: Can't find stylesheet to import.
- Infinite Select's default value is not selected when form is loaded HOT 8
- More info on features needed HOT 3
- Pagetables don't work with self join. HOT 3
- Dependency Issue HOT 7
- Modification of boilerplate HOT 5
- Could not resolve './Deselect' HOT 4
- Excel export HOT 4
- enum data type HOT 2
- DataTables warning: table id=users-dt - Ajax error. For more information about this error, please see http://datatables.net/tn/7 HOT 2
- what is index action in controller in API being used for HOT 3
- Submenu - no proper documentation or example available HOT 1
- Support php 8.2 HOT 1
- innocenzi/laravel-vite package should be removed for laravel 10
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from jetstream-inertia-generator.