Problem/Motivation
Hi Team,
I am not sure if this bug is because of Views or because of Block module, but here is the issue I am facing.
What behavior were you expecting?
- There should be one AJAX hit, and the throbber should go.
What happened instead?
- There were multiple AJAX hits, as many number of exposed forms, that many ajax hits. 2 forms, 2 ajax hits.
- The throbber doesn't go, as it adds multiple throbbers, but remove only one.
I have tried this on a vanilla install, also this is happening on one of my projects I am working on.
Happy to provide any further information and help.
Thanks.
Steps to reproduce
- Create a new view, say a content view and a page display.
- Add filters and expose them (I also exposed sort).
- Enable "Exposed form in block" to Yes
- Enable AJAX.
- Go to blocks page, and then place the block in 2 regions, or any multiple regions.
- Go to the new view and try applying filters.
- Make sure to open the debug tools, to capture the AJAX hits.
Proposed resolution
TBD
Remaining tasks
TBD
User interface changes
TBD
API changes
TBD
Data model changes
TBD
Release notes snippet
TBD
Comment | File | Size | Author |
---|---|---|---|
#65 | multiple-ajax-submissions-2876197-64.patch | 8.11 KB | Luke_Nuke |
#41 | multiple-ajax-submissions-2876197-41.patch | 9.03 KB | Luke_Nuke |
Comments
Comment #2
dawehnerInteresting, this sounds indeed like a total bug in views.
Comment #3
jibranComment #4
SwapS CreditAttribution: SwapS as a volunteer and at Tech Mahindra commentedIndeed an issue . Good catch vaibhavjain.
SwapS
Comment #5
Anonymous (not verified) CreditAttribution: Anonymous as a volunteer commentedI tested this and I think its more to do with form ID. Multiple forms with the same ID in single html would always have side effects.
Comment #6
thelmer CreditAttribution: thelmer at Adapt commentedI had the samme issue when inserting the same view with an exposed form multiple times.
It seems to be related to the selector used to add the javascript. It uses the id of the exposed form and this id is the same for each instance.
Adding the surrounding forms (unique) id as a context to the jquery selector fixes the problem.
Comment #7
thelmer CreditAttribution: thelmer at Adapt commentedNotice, that my patch in #6 don't work with exposed forms inserted as blocks outside the view dom.
We will need a fix that either :
- only use the context if the exposed form is not placed with a block
- change the form id to a class and update the selector in the javascript to use this
Comment #8
piyuesh23 CreditAttribution: piyuesh23 at QED42 commentedWe can make selectors contextual by exposing the block ids via block alter via drupalSettings & using the same in ajax_views.js . Adding a patch for 8.3.x here.
Comment #9
piyuesh23 CreditAttribution: piyuesh23 at QED42 commentedApologies, Patch #1 uploaded accidentally. Was meant for facets module.
Comment #13
TommyChrisReroll the patch for 8.4.0
Comment #14
borisson_Setting to needs review so that the testbot can pick this patch up.
Comment #15
Anonymous (not verified) CreditAttribution: Anonymous as a volunteer commentedJust tested with Drupal 8.4 and #13 solves the issue.
Comment #16
xjmThanks for working on this issue! There are a couple of things we need in order commit this fix:
hook_block_view_alter()
, rather than in the block class itself in/core/modules/views/src/Plugin/Block/ViewsExposedFilterBlock.php
? Tagging for subsystem maintainer review for feedback on the solution.core/modules/views/tests/src/FunctionalJavascript/ExposedFilterAJAXTest.php
for that./core/modules/views/js/ajax_view.js
, we should change/core/modules/views/js/ajax_view.es6.js
, andajax_view.js
should be auto-generated from it. See the change record about ES6 for more information. The JS will probably also need a few changes to comply with the AirBnB coding standards. See #2912962: Step 1 JS codestyle: [meta] Fix JS coding standards in core for more information on checking the ES6 file against the standard.Thanks!
Comment #17
tim.plunkettI agree with #16.1, this should be added to
\Drupal\views\Plugin\Block\ViewsExposedFilterBlock::build()
Comment #18
sam.spinoy@gmail.com CreditAttribution: sam.spinoy@gmail.com at Adapt commentedTested patch in #13, it actually broke my setup. I have a view with exposed filters and Ajax enabled, it broke the Ajax part. Page with view on just reloads with url parameters when clicking a filter.
Comment #19
sam.spinoy@gmail.com CreditAttribution: sam.spinoy@gmail.com at Adapt commentedRerolled thelmer's patch for 8.4.
Comment #22
i.bajrai CreditAttribution: i.bajrai commentedI have tested this on a page with multiple exposed filters in different parts of the DOM.
I believe its a relatively simple fix and just an oversight TBH.
Comment #23
pnagornyak CreditAttribution: pnagornyak commentedThis seems like related.
Comment #26
nod_consolidating issues under the JavaScript tag
Comment #27
pcambraSetting to review as patch in #22 doesn't apply for the feedback on #16
Comment #28
jacobbell84 CreditAttribution: jacobbell84 at ZenSource commentedQuick reroll so the patch applies on 9.2
Comment #29
apadernoOn Drupal 8.9.x, only security issues are fixed.
Comment #31
dk-massive CreditAttribution: dk-massive at Aten Design Group commentedRerolled the patch to apply to 9.3
Comment #33
apadernoComment #34
Luke_Nuke CreditAttribution: Luke_Nuke as a volunteer commentedPatch updated for 9.4 .
I wonder how we should test this though. Ideally we should be able to detect multiple requests in a functional JS test, but can it be even done in Drupal's testing framework?
Comment #35
Luke_Nuke CreditAttribution: Luke_Nuke as a volunteer commentedWhoops, wrong patch. This one follows Drupal's js practices and building process.
Comment #36
Luke_Nuke CreditAttribution: Luke_Nuke as a volunteer commentedLet's try again.
Comment #37
Luke_Nuke CreditAttribution: Luke_Nuke as a volunteer commentedAlright, this is my attempt at testing for this issue. I'm not sure if that's the best way of doing that, but it's something.
Comment #38
Luke_Nuke CreditAttribution: Luke_Nuke as a volunteer commentedAnd again a patch issue -_- . Here is the correct one.
Comment #39
Luke_Nuke CreditAttribution: Luke_Nuke as a volunteer commentedAnd here is the complete solution.
Comment #41
Luke_Nuke CreditAttribution: Luke_Nuke as a volunteer commentedI think the previous error was caused by my IDE adding EOL at the end of the file, where it shouldn't be. Let's hope we will finally get it working.
Comment #42
Luke_Nuke CreditAttribution: Luke_Nuke as a volunteer commentedComment #43
ahed91 CreditAttribution: ahed91 as a volunteer commentedUpdate the patch #6 by @thelmer to work with version 7.x-3.24.
Comment #44
poker10 CreditAttribution: poker10 at ActivIT s.r.o. commentedThis issue is for Drupal 9 core views module. If you would like to patch Views module for Drupal 7, please create an issue in the Views issues queue here: https://www.drupal.org/project/views
Reverting version.
Comment #45
sneha_surve CreditAttribution: sneha_surve commentedpatch #41 works for me on Drupal 9.3.13
Comment #47
Johan den Hollander CreditAttribution: Johan den Hollander at Finalist commentedAlso happy with the #41 patch as it fixes my double throbber trouble.
Comment #48
rondog469 CreditAttribution: rondog469 commentedpatch #41 is also working for me on 9.4.5. I was wondering why my search was getting progressively slower and the throbber wasn't disappearing.
Comment #49
kazah CreditAttribution: kazah commentedNOT WORKING (patch #41) on 9.4
Comment #50
kazah CreditAttribution: kazah commentedComment #51
nod_Is there is a patch but it's not addressing the issue, the status to set is needs work :)
Comment #52
Luke_Nuke CreditAttribution: Luke_Nuke as a volunteer commented@kazah
Me, @rondog469 and tests confirmed that this patch works on Drupal 9.4. Could you please describe the steps you followed to get your result? Could anyone else chime in?
Comment #53
kazah CreditAttribution: kazah commentedAfter applying patch #41 ajax throbber not disappear the same as in comment #48
Comment #54
kazah CreditAttribution: kazah commentedI am using
better exposed filters
module with ajax enabled option.Still have two ajax throbbers, after click apply first throbber dissapear the second still exist.
Comment #55
kazah CreditAttribution: kazah commentedAlso I found that barrio theme use button as submit element not input.
Comment #56
rondog469 CreditAttribution: rondog469 commentedI am using bs5 theme and submit button is an input. The patch looks like it takes into account if its a button or input
Comment #57
kazah CreditAttribution: kazah commentedOk, it works in bartik theme.
But for some reason it doesn't work it barrio theme...
Comment #58
Luke_Nuke CreditAttribution: Luke_Nuke as a volunteer commented@kazah
Does barrio's button have
type="submit"
attribute?Comment #59
kazah CreditAttribution: kazah commentedThank you all! Now it works.
Barrio theme rewrites
ajax_view.js
I delete these lines in
bootstrap_barrio.info.yml
Comment #60
Luke_Nuke CreditAttribution: Luke_Nuke as a volunteer commentedGood to hear that you managed to solve it. It means that barrio needs to port this change to its ajax_views.js to have it fixed. I'm switching back to the
Needs review
status. I hope we can get RTBC soon.Comment #61
Luke_Nuke CreditAttribution: Luke_Nuke as a volunteer commentedI also made a patch for Drupal 10.
Comment #62
Luke_Nuke CreditAttribution: Luke_Nuke as a volunteer commentedForgot to run phpcs, so here is the patch with fixed styling issues.
Comment #64
apadernoComment #65
Luke_Nuke CreditAttribution: Luke_Nuke as a volunteer commentedI see what went wrong with D10 patch. Attempt at fixing it.
Comment #66
Luke_Nuke CreditAttribution: Luke_Nuke as a volunteer commentedComment #68
smustgrave CreditAttribution: smustgrave at Mobomo commentedThis could use an issue summary. Started it but someone familiar with the issue should fill in