1. Home
  2. Forum
  3. React - EJ 2
  4. Keep the parent expanded while searching a child

Keep the parent expanded while searching a child

Hi team,

Is there any possibility to keep parent expanded when searching for a child? Please refer this StackBlitz project.

https://stackblitz.com/edit/react-coyfjm-yye1ex

Also when we are typing logo flickers if it is a broken image. We replaced the broken images with a default image when an error occurs.( using the following css class). Default image also flickers when searching a child.

.e-list-img::before {
                    content: ' ';
                    display: block;
                    position: absolute;
                    background-color: 'white';
                    height: 30px !important;
                    width: 30px !important;
                    background-image: url(/static/placeholder-logo.png);
                    background-position: center;
                    background-size: cover;
                }

Please let us know if you have solutions on these issues.

Best Regards.


3 Replies
LD LeoLavanya Dhanaraj Syncfusion Team December 9, 2022 06:17 PM UTC

Hi Brainweber,


Greetings from Syncfusion support.


Query 1 : Is there any possibility to keep parent expanded when searching for a child?


We have validated your reported issue in React Dropdown Tree component with the Filtering support. However, we were not able to reproduce the reported issue at our end. For your reference, we included the sample. Check the attached sample and if the issue still persists, share the issue replicated video footage for reference.


Query 2 : When we are typing logo flickers if it is a broken image


We suspect that the Image flickering issue is occurs because you have overridden the icons in your sample. To overcome the issue, we suggest using the itemTemplate property for image tags rendering.  


Sample : https://stackblitz.com/edit/angular-tcctxz?file=app.component.html


Check out the below mentioned links to know more about Dropdown Tree Template property.


Documentation : https://ej2.syncfusion.com/react/documentation/drop-down-tree/templates/


Demo : https://ej2.syncfusion.com/react/demos/#/bootstrap5/drop-down-tree/template


API references : https://ej2.syncfusion.com/react/documentation/api/drop-down-tree#itemtemplate


Regards,

Leo Lavanya Dhanaraj


BD Brainweber Dev January 4, 2023 11:29 AM UTC

Hi,
Thanks for the reply..

Regarding Query 1:

Please refer the given example and refresh the page to reproduce the issue. 
Also I have attached the issue replicated video footage for reference.

 https://drive.google.com/file/d/1OkoDShpbTsglUpitUQ7B8kURkDeEFq7k/view?usp=sharing

https://stackblitz.com/edit/react-coyfjm-yye1ex


LD LeoLavanya Dhanaraj Syncfusion Team January 9, 2023 04:28 PM UTC

Brainweber, In our Dropdown Tree component, we have re-rendered the component(popup) with datasource after the filtering process. So that you have experienced the flickering /popup open & close in the User Interaction(UI). Please note that this is currently the expected behavior of our Dropdown Tree component.


In the meantime, if you have any further questions or concerns, please don't hesitate to reach out to us. We will be happy to assist you.


Regards,

Leo Lavanya Dhanaraj


Loader.
Up arrow icon