F
Filament2mo ago
Djomla

Table Filter Custom Option Html

Hi all, In my resource $table, I want to have custom html in one of my select filters.
->filters([
Tables\Filters\SelectFilter::make('sport_id')
->options(function () {
$sports = Sport::all();

return $sports->mapWithKeys(function ($sport) {
$imageUrl = url('/storage/' . $sport->image);
$optionLabel = "<span class='filter-option'>
<img src='{$imageUrl}' alt='{$sport->name}' class='sport-icon'>
{$sport->name}
</span>";
return [$sport->id => $optionLabel];
})->toArray();
})
->searchable()
->label('Sport'),
->filters([
Tables\Filters\SelectFilter::make('sport_id')
->options(function () {
$sports = Sport::all();

return $sports->mapWithKeys(function ($sport) {
$imageUrl = url('/storage/' . $sport->image);
$optionLabel = "<span class='filter-option'>
<img src='{$imageUrl}' alt='{$sport->name}' class='sport-icon'>
{$sport->name}
</span>";
return [$sport->id => $optionLabel];
})->toArray();
})
->searchable()
->label('Sport'),
But Im getting raw HTML as result.
No description
Solution:
GitHub
Htmlable Select Filter by CodeWithDennis · Pull Request #14228 · fi...
Description The SelectFilter didn&#39;t support the -&gt;allowHtml() method, even though the Select:: form component does. This PR fixes that issue. Visual changes Functional changes Co...
Jump to solution
6 Replies
LeandroFerreira
LeandroFerreira2mo ago
$optionLabel = new HtmlString("<span class=...
Djomla
DjomlaOP2mo ago
@LeandroFerreira Can you provide whole example how can I get image in label in SelectFilter as I can't make this to work Thanks
anacrk
anacrk2w ago
Struggling with the same issue, it seems that filters do not allow html inside, i tried with HtmlString, string, rendered blade view etc... Anyone have an idea for this ? 👀
toeknee
toeknee2w ago
Sounds like the SelectFilter needs support adding for allowHtml()
Solution
toeknee
toeknee2w ago
GitHub
Htmlable Select Filter by CodeWithDennis · Pull Request #14228 · fi...
Description The SelectFilter didn&#39;t support the -&gt;allowHtml() method, even though the Select:: form component does. This PR fixes that issue. Visual changes Functional changes Co...
anacrk
anacrk2w ago
Thank you so much!
Want results from more Discord servers?
Add your server