Select preload multiple populating values again when I click on x on multiple items
Hello,
I am using Filament V3 Select with following code:
Select::make("ranges")
->relationship("ranges", "title")
->label("Ranges")
->multiple()
->default(function () {
return Range::get()->pluck("id")->toArray();
})
->preload()
->required(),
I have preloaded the ranges and when I want to deselect few of them by clicking on x quickly it basically removes a few and reloads some of the values back again, if I click on them one by one slowly then it works fine.
Please let me know how can I make it work smoothly?
Thank you so much.
32 Replies
Please help me figure this out.
someone please reply 😦
Sounds like a reactive() problem
Do you have a higher-level reactive(), lazy() or something like that somewhere?
no not at all on this resource
there is 1 textinput and 4 select just like this one
and none of them are reactive or live
Please, is there any fix for this issue?
it has been more than a week now and I couldn't find the solution.
@awcodes @toeknee I am sorry to tag you but this is really important, I really wish you could please help me figure this out.
@Dan Harrin I am sorry to tag you as well.
Thank you
This will be caused by a slow request against your server, you clicking it multiple times will be causing a delay and one is overlapping the other as livewire sends the state from the browser which will be updated from your previous one. So I would look at what’s making the request so slow.
Or fire a loading overlay when livewire is processing
Yes I understand, this is the slow response from server. There are other forms which had similar issue so I replaced it with CheckboxList and it works like a charm, it doesn't send request to server on every check/uncheck. Is it possible to make Select work like that as well ?
I mean just not send request to server when removing items until we lose focus or something ?
I understand by clicking on remove button we are also loosing focus but I am struggling to make this work as client is insisting on using the same server and he says he only wants this fixed and other slowness issues are ok with him.
this shouldnt hit the server each time you remove
unless the field is live()
how long do you need to wait between clicks
Select::make("custom_recipients")
->label("Custom Recipients")
->hidden(function ($livewire) {
if (($livewire->send_to == "all" || $livewire->send_to == "select") && null !== $livewire->opportunity) {
return false;
} else {
return true;
}
})
->options(function ($livewire) {
$options = [];
$buyer_contacts = BuyerContact::whereNotIn("id", $livewire->recipients)
->where("alert_emails", 1)
->where("sandboxed", 0)
->get();
if (null !== $buyer_contacts) {
foreach ($buyer_contacts as $buyer_contact) {
if (null !== $buyer_contact->buyer) {
$options[$buyer_contact->id] = $buyer_contact->first_name . " " . $buyer_contact->last_name . " (" . $buyer_contact->buyer->name . " - " . $buyer_contact->email . ")";
} else {
$options[$buyer_contact->id] = $buyer_contact->first_name . " " . $buyer_contact->last_name . " (" . $buyer_contact->email . ")";
}
}
}
return $options;
})
->multiple(),
I am using this as this is dependant on 2 other select options
the $livewire->recipients is basically the pre-selected items in the select option and the custom recipients list has to filter out the ones selected in recipients list which is why I can't even cache it.
$livewire->recipients also has the same issue though which is only populated when the project name changes once.
I am using this in custom Livewire component
is there a way to make it disabled while loading on each server request please ?
it would still be better for now to stop user from removing items until the first one is removed
it hits the server on every removal even though i don't need to update those options until the other model has changed
so have you opened an issue on github while youve been waiting for more than a week?
yes I did
can you send it?
it is in the discussion
let me send the link please wait
GitHub
Select preload multiple populating values again when I click on x o...
Hello, I am using Filament V3 Select with following code: Select::make("ranges") ->relationship("ranges", "title") ->label("Ranges") ->multiple() -&...
that is a discussion
issues are for reporting bugs and require a reproduction repository
Yes I understand, but it is not possible for me to post the reproduction repository as it is really complicated.
we are not asking you to submit your current app, we are asking you to make a new one just for this bug
and if you can't even do that yourself, what chance do us maintainers have of fixing the bug we've never seen before
Yes you are right, is it ok if I share the migration and the resource file just for this option ?
there are a lot of relationships being used for all the data I am not really sure how to make one just for this issue, but the initial issue which I changed to checklistbox also had same issue with just 5 records.
and those were not even using any relationships
public static function form(Form $form): Form
{
return $form
->schema([
Grid::make(1)
->schema([
TextInput::make("name")
->unique(ignoreRecord: true)
->live(onBlur: true)
->debounce(500)
->required(),
Placeholder::make("short_name")->content(function (Get $get) {
return getBuyerShortName($get('name'));
}),
CheckboxList::make("regions")
->relationship("regions", "title")
//->multiple()
->default(function () {
return Region::get()->pluck("id")->toArray();
})
//->preload()
// ->gridDirection("row")
->bulkToggleable()
->columns(3)
->required(),
CheckboxList::make("industries")
->relationship("industries", "title")
//->multiple()
->default(function () {
return Industry::get()->pluck("id")->toArray();
})
//->preload()
// ->gridDirection("row")
->bulkToggleable()
->columns(3)
->required(),
])
]);
}
regions, industries both has same issue so I changed them to checkboxlist
i'm not going to speak for other team members, but unless i have a minimal reproduction repository I do not investigate issues.
I understand.
I will definitely post a reproduction repository and post in issues section by tomorrow.
thank you so much
please do not include anything in the reproduction repository that is unrelated to the problem
the less code the better
yes I will make a new one with only the ones which has the issue, even though this method is being used all over but if one gets fixed others will be too
Hello @Dan Harrin hope you are doing good
I have posted the issue here: https://github.com/filamentphp/filament/issues/9844
GitHub
live() Select multiple options re-appear when removing quickly on r...
Package filament/forms Package Version ^3.0-stable Laravel Version ^10.0 Livewire Version V3.0.0 PHP Version PHP 8.1 Problem description I am using multiple (live - important) Select Component with...
I have also posted the video from my local server
ok, why are there 4 resources?
you can test any of them, all have same issue
I just wanted to add more resources to make the form use more resource to test
Thank you so much
@Dan Harrin I think updating to latest Livewire version worked on the reproduction app for me there are no repeats, I found that production server has Livewire v2 and I updated it to Livewire 3 just now and it asked me a lot of changes to make which I did on front end but do I have to update those settings on the Filamentphp panel as well?
your reproduction repository is using Filament 3 which depends on Livewire 3
im not sure how you've ended up with Livewire 2
Yes it was Livewire 3.0 and still had issue but I upgraded it to latest Livewire version as Tony suggested on the issue page and it seems to work fine.
But now found out the production app had v2 so upgraded it and made some fixes as it suggested on front-end
just wanted to know that if FilamentPHP will still work like before after uprading to Livewire 3 as I haven't touched any files in it to make the latest changes suggested by Livewire 3
you need to follow the filament upgrade guide
there is a page on upgrading from filament v2 to v3
Filament was still v3 in composer.json
and my composer.lock file had this
"require-dev": {
"livewire/livewire": "^2.3",
"orchestra/testbench": "^7.0|^8.0",
"phpunit/phpunit": "^9.0|^10.0"
},
this is from composer.json
"require": {
"php": "^8.1",
"aws/aws-sdk-php": "^3.283",
"filament/filament": "^3.0-stable",
"guzzlehttp/guzzle": "^7.2",
"laravel/framework": "^10.10",
"laravel/sanctum": "^3.2",
"laravel/tinker": "^2.8",
"mohamedsabil83/filament-forms-tinyeditor": "^2.0"
},
there is something seriously wrong, im not sure i can help
it doesnt add up
yes exactly this is what I am confused about now 😦
I don't want to mess things up on the production server which is why I am testing it out on local first.
Solution
upgraded it on live server as well and seems to work good now
Thank you so much @Dan Harrin