TinySlider's data update issue - Blazor hosted
Hi,
I'm combining a "timeline view" (Activities list in your demos) with TinySlider. This is how I do it :
+ I have in each line a list of text that slides horizontaly via TinySlider, each text is a slider element. At far right, and far left there's slider control arrows and dots above.
+ The other lines compose other text sliders that are completely independents from the others.
+ So I have as many (data-tns="true") as list groups, each one has its own controllers
+ The whole is inside the timeline with a left vertical bar that represents order
The issue pops out when I add a button to switch order (Importance/Chronology). By default importance is set and the component render perfectly. Than when I switch order It orders correctly but TinySliders renders poorly even with await JS.InvokeVoidAsync("KTApp.init") OnAfterRenderAsync().
For exp if Importance order shows 5 elements in the first line, than after the switch even if there's only 1 new element that replaces the 5 in this line the setup ( number of dots, width of elements...) is based on 5 elements rather than the now count so the render is complete mess.
Any help please?
TY
Replies (6)
Hi, could you please answer? Thanks
Hi Ania Berthelot,
Thank you for reaching out to us.
Please note that OnAfterRenderAsync() will be triggered when the page gets loaded, when you change an order most likely your slider elements get rerendered and they are not considered as a slider element anymore. To fix this after changing an order you can call slider initialization function.
Regards,
Lauris Stepanovs,
Keenthemes Support Team
1-Thank you for the reply I tried in many places including OnParametersSetAsync() still not working.
I noticed in Js part that
// Sliders
const elements = Array.prototype.slice.call(document.querySelectorAll("[data-tns="true"]"), 0);2-I saw also that sliders with any number of content works fine except 3 elemets it's slightly marged negatively to the left.
3-Is there a way to set a video call to solve this please?
Thank you
Hi Ania Berthelot,
First of all, I want to apologize for the late response.
1. As I understood a first initialization is working fine for you, the error appears only when you change an order. My guess is that it might be related to element reinitialization, you need to recall tiny-slider initialization function right after elements get reinitialized.
2. Do you have the same issue in the examples in our documentation?
https://preview.keenthemes.com/html/metronic/docs/general/tiny-slider/basic
3. Unfourntlety, our support is limited with a devs platform. Please check out our support policy.
Regards,
Lauris Stepanovs,
Keenthemes Support Team
Help pls
Is there any cache system?
