I cannot extend my grids with Javascript extensions #33676
Unanswered
ElFamosoWilli
asked this question in
Q&A
Replies: 1 comment 2 replies
-
Hello @ElFamosoWilli I converted the Issue you created to a discussion because you're looking for help, not reporting a bug in the software.
Starting in 1.7.8, you can use Grid extensions and global JavaScript components without compiling them. Please check the documentation here: I used |
Beta Was this translation helpful? Give feedback.
2 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
Prerequisites
Describe the bug and add attachments
Here is my issue , I try to add extensions with javascript and webpack to my grid, I did it because I wanted the pagination to work and therefore I needed to do that .
My grid is implemented by my module, the grid is displaying fine and the links for the pagination are also displaying.
To make sure that my script got executed I did a console.log on my grid , and it displays me the grid I chose to implement the extensions (to be precise it displays the container with the grid) , because I have multiple grids my code is a bit different from the documentation , but it's essentially the same thing excepts it targets all the grid I display .
When I click on the link of the pagination, the correct offset and limit in order to have my second page are present in the link
but my page stays the same and I do not have my other pages instead it stays the same , it's not due to a bad request I have a 200 code therefore it's not due to that .
Could have I missed something important in order for it to work ? (an import , a route maybre ? )
Expected behavior
The page of the grid change when you click on the pagination links .
Steps to reproduce
Implement your grid in your module with the default implementation as seen in the documentation
https://devdocs.prestashop-project.org/1.7/development/components/grid/#grid-definition
Then implements your javascript extensions with the help of webpack following this exemple : https://github.com/PrestaShop/example-modules/tree/master/demo_grid
Then try to change pages with the links of pagination .
`
<script src="{{ asset('/modules/stabs/views/templates/admin/js/extrafieldsgrid.bundle.js') }}"></script> <script src="{{ asset('themes/default/js/bundle/pagination.js') }}"></script>{% include '@PrestaShop/Admin/Common/Grid/grid_panel.html.twig' with {'grid': grid} %}
{% include '@PrestaShop/Admin/Common/Grid/grid_panel.html.twig' with {'grid': extragrid} %}
{% block javascripts %}
{{parent()}}
{% endblock %}
`
`
import Grid from '@PSJs/components/grid/grid';
import LinkRowActionExtension from '@PSJs/components/grid/extension/link-row-action-extension';
import SubmitRowActionExtension from '@PSJs/components/grid/extension/action/row/submit-row-action-extension';
import SortingExtension from '@PSJs/components/grid/extension/sorting-extension';
import FiltersResetExtension from '@PSJs/components/grid/extension/filters-reset-extension';
const { $ } = window
$(() => {
let gridDivs = document.querySelectorAll('.js-grid');
gridDivs.forEach((gridDiv) => {
const grid = new Grid(gridDiv.dataset.gridId)
grid.addExtension(new SortingExtension());
grid.addExtension(new LinkRowActionExtension());
grid.addExtension(new SubmitRowActionExtension());
grid.addExtension(new FiltersResetExtension());
console.log(grid);
})
});
`
`
$SearchCriteria = new SearchCriteria([], 'id_product', 'DESC', 1, 2);
$gridfactory = $this->get('prestashop.core.grid.visible_grid_factory');
$visiblegrid = $gridfactory->getGrid($SearchCriteria);
`
PrestaShop version(s) where the bug happened
1.7.8.9
PHP version(s) where the bug happened
7.4.33
If your bug is related to a module, specify its name and its version
No response
Your company or customer's name goes here (if applicable).
No response
Beta Was this translation helpful? Give feedback.
All reactions