Mehmet K.
How to Build a Drag-and-Drop Navigation Menu in Filament without Third-Party Packages?
Hi everyone,
I'm working on a Laravel Filament project, and I want to create a drag-and-drop navigation menu management system directly within the admin panel without relying on third-party packages like filament-navigation.
Here's what I aim to achieve:
Dynamically manage menu items with parent-child relationships.
Allow sorting of menu items using a drag-and-drop interface.
Save the updated menu order to the database.
I've already considered using Sortable.js for the frontend drag-and-drop functionality, but I'm unsure about the best practices for integrating this into Filament, especially for handling hierarchical menu structures (nested menus).
If anyone has experience or suggestions on how to implement this, or can provide a starting point for the migration, model relationships, or Filament resources, I’d greatly appreciate it!
2 replies
Filament Table Filtering: Summarizing Data by Year in Separate Rows
I want to apply a filter to my Filament table. My goal is to create a separate row for each year as a result of the filtering, and summarize the data for that year in each row.
For example, I want to obtain a result like this after filtering:
For filtering, I'm using the following code:
php
However, this code doesn't give me the desired result. All records are returned as a result of the filtering, and a separate row is not created for each year.
My questions are:
What changes do I need to make in the filtering code?
What steps should I follow to create a separate row for each year and summarize the data for that year?
How can I display the data obtained from the query result in the Filament table?
Thank you in advance for your help.
Best regards.
1 replies
Repeater is not working in custom modal form.
I define a custom modal form in my table, I define a form for it and establish the hasmany relationship, but when I open the form, the repeater comes empty.
How can I solve this, what do you suggest?
Tables\Columns\TextColumn::make('relation_order_id')
->label(function () {
return new HtmlString("<span style='color: #0e82fc;'>İlişkili Kayıt No</span>");
})
->sortable()
->getStateUsing(function ($record) {
return new HtmlString("<span style='color: #111192; font-size: 14px; font-weight: bold;'>{$record->relation_order_id}</span>");
})
->searchable()
->action(
Action::make('openForm')
->form([
Repeater::make('qualifications')
->relationship()
->schema([
// ...
])
)]
->label('Detayları Göster')
->modalWidth('7xl') ) ->toggleable(),
->modalWidth('7xl') ) ->toggleable(),
1 replies
Is it Possible to Open a Modal within Another Modal in Laravel Filament?
Hello Filament Community,
I am working on a project using Laravel Filament, and I came across a situation where I need to open a second modal inside an already opened modal. In other words, I want the user to be able to trigger a second modal from within the first modal and have both modals function independently of each other.
What I am trying to achieve:
Open a primary modal form.
Place a button inside the primary modal.
When the button is clicked, it should open another modal (secondary modal) inside the first one.
I am curious if Filament natively supports opening nested modals. If not, what would be the best way to achieve this, or any recommended workarounds?
Solutions I've Tried:
Using Livewire to Trigger Modals: I created both modals as Livewire components and tried to use JavaScript to trigger the second modal via a button click inside the first one. I attempted to use Livewire.on() to open the second modal via JavaScript, but encountered issues with styling and focus management for the nested modals.
Manually Handling the Modals with JavaScript: I tried manually opening the second modal by removing the Tailwind CSS classes (like hidden) to make it visible. However, this approach felt a bit messy and led to some complexity.
My Questions:
Does Filament support opening one modal inside another out of the box?
If not, what would be the recommended way to implement this (for example, do I need to use JavaScript or Livewire customizations)?
Has anyone faced a similar requirement, and how did you handle it?
I would greatly appreciate any suggestions or guidance. Thank you in advance!
3 replies