DHTMLX Suite DataView container height clipping and focus loss on dynamic data updates

Chatbot
1

DHTMLX Chatbot is a JavaScript UI chatbot widget for AI support agents. It allows using any large language model. The widget is shipped under the MIT license.

Find useful resources about DHTMLX Chatbot:Hi everyone, I have been working on integrating a real-time name suggestion panel into our DHTMLX Suite application and ran into an unexpected rendering glitch. I am dynamically streaming batches of generated business names from a tool I was testing here directly into a dhtmlxDataView component, but whenever the dataset updates with strings of varying character lengths, the container height fails to recalculate properly and ends up clipping the bottom row of items.

In addition to the height truncation, the selection focus drops completely whenever new items are appended asynchronously, which disrupts keyboard navigation for anyone tabbing through the results. I attempted to force a manual repaint and recalculate the container dimensions on each incoming batch, but that introduces a harsh UI flicker on smaller screens and occasionally breaks the internal scroll position.

Has anyone encountered this type of layout recalculation issue when binding dynamic text feeds to DHTMLX DataView, and what is the cleanest lifecycle event or configuration setting to handle smooth resizing without having to destroy and rebuild the component?

2

Hello byte_pilot_910,

Unfortunately your question isn’t fully clear for me, as it’s hard to understand what exactly component you are reffering to - the ChatBot component:

or the DataView component:

Could you please clarify, also it may be helpful if you reproduce your config in the snippet tool:

(open the snippet => reproduce your config => click the “Save” button => send me the new link)

So I will be able to check out what exactly goes wrong and provide solution(if it will be possible).

Kind regards,