Filament•8mo ago

Additional data in a Select component?

Hello, I'm wondering is there a way to add additional data alongside the title for the options in a select component? I have a list of users that have a HasMany relationship to comments and I'd like to add a counter of how much comments they have in the right side of the options along with the user title. Is this possible?

4 Replies

LeandroFerreira•8mo ago

https://filamentphp.com/docs/3.x/forms/fields/select#allowing-html-in-the-option-labels

Select - Form Builder - Filament

GediminasOP•8mo ago

So, if you'd like to, let's say add a <span> element as shown here, but for a select component which loads options through a relationship, then I'm guessing you'd have to return the title attribute already formatted with the <span> element, and not in the select component itself?

LeandroFerreira•8mo ago

hum.. maybe you can achieve this using options, for example

->options(function () {
    $users = User::withCount('posts')->get();

    $users = $users->mapWithKeys(function ($user) {
        return [$user->id => "<div class='flex justify-between'><span>{$user->name}</span><span>{$user->posts_count}</span></div>"];
    });

    return $users;
})

->options(function () {
    $users = User::withCount('posts')->get();

    $users = $users->mapWithKeys(function ($user) {
        return [$user->id => "<div class='flex justify-between'><span>{$user->name}</span><span>{$user->posts_count}</span></div>"];
    });

    return $users;
})

GediminasOP•8mo ago

This solution seems to somewhat work, but I'd like to be able to use this as a multiselect component and a problem arises when an item is selected... The count get clumped together with the title in the "badge" form, where it has the orange background. Is there a way to not display the count when an item has been selected?

Gaming

Programming

Additional data in a Select component?