Fixes #847: table duplication on mobile views due to multiple initializations #848
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Changes include: - Added a check to remove existing `.stacktable` elements if they are present. - Cleared the table body (`tbody`) before new data is injected. - Re-applied the `stacktable` plugin only if the table has not been previously stacked.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
** Summary**
This pull request resolves an issue where the responsive table implementation (using the
stacktableplugin) was causing duplicate tables to be rendered on mobile devices. The changes ensure that only a single instance of the responsive table is present at any given time, preventing duplication and maintaining a consistent user experience across devices and refreshes.Changes
Added a check to remove existing
.stacktableelements if they are present: Before initializing thestacktableplugin, the code now checks if any existing.stacktableelements exist in the DOM. If found, these elements are removed to prevent duplication.Cleared the table body (tbody) before new data is injected: To ensure a clean slate before rendering new data, the existing table body (tbody) is now emptied before the new rows are injected.
Re-applied the stacktable plugin only if the table has not been previously stacked: The stacktable plugin is now initialized only if the table does not already have the stacktable class, preventing redundant initialization and potential conflicts.
Motivation
To fix a bug where mobile devices showed the same table twice after refreshing data. The goal is to make sure that the tables on mobile are shown correctly without any errors.
Testing
The changes have been thoroughly tested in the following scenarios:
In all cases, the expected behavior of maintaining a single instance of the responsive table was consistently observed, with no duplication of tables or rendering issues.