In django template (queryset) when scrolling remove div blocks as soon as they disappear from the browser's field of view, i.e. dynamically when scrolling down, delete blocks from the top, when scrolling up, delete blocks from the bottom and when need to re-display them? (Sorry for my English)
2 Answers
Django's templates can only be used for server-side rendering. Django passes a context dictionary filled with data to the rendering engine, which will use that data and the template to generate a HTML document that is served to the client. After the HTML document has been rendered and served to the user, Django's templating system cannot be involved anymore.
The behavior that you are describing, can only be implemented on the client-side. A typical solution for this kind of problem typically involves two things:
- a front-end framework (e.g. react, vue, etc.) that is used on the client-side to render the data and controls
- an API that can be called by the front-end framework to fetch/submit data
There's a mature REST framework for Django that you can use to implement the API, and you can use any front-end framework to handle the client-side rendering.
You can use the Intersection Observer API to see if a <div> is visible and remove or add its content to the DOM.
Use the Fetch API to get the data form the backend.
To render, you could simply write a Web Component that uses a template with the required layout.
Related