We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Filter clean button

Thread ID:

Created:

Updated:

Platform:

Replies:

144487 May 8,2019 04:28 PM UTC May 15,2019 07:04 AM UTC Angular - EJ 2 5
loading
Tags: Grid
Julio Cezar Mendonca
Asked On May 8, 2019 04:28 PM UTC


Good afternoon, I would like to know how to do the 'clean' button of the filter just wipe the input (reset the filter) and do not close it. When I click the clean button it is always cleaning and closing the filter screen, I would like you to just clear the fields. Follow the attached image to help with the sample. Thank you

Attachment: Aliquot2_bb9ed244.zip

Hariharan J V [Syncfusion]
Replied On May 10, 2019 01:14 PM UTC

Hi Julio, 
  
Greetings from Syncfusion. 
  
Query: I would like to know how to do the 'clean' button of the filter just wipe the input (reset the filter) and do not close it. When I click the clean button it is always cleaning and closing the filter screen, I would like you to just clear the fields. Follow the attached image to help with the sample. 
  
Before starting your requirement, could you please confirm your requirement. It will be helpful to provide a better solution. 
  
  • Whether do you want to clear the entered text only before filtering the records and want to show the filter dialog always?. (or)
  • Do you want clear the already filtered filter values and you want to show the filter dialog.
  
Regards, 
Hariharan 


Julio Cezar Mendonca
Replied On May 10, 2019 01:21 PM UTC


Good Morning, I would like to clean only the filter values, I will try to exemplify, imagine that the user typed something wrong and want to clean the fields without closing the screen. I know we could use backspace, but this would be a requirement of the user, that when we click on the 'Clear' button the fields are, say, reset and the filter is still open for filling (with empty fields). I was able to better illustrate my question? Thankful, Júlio C. Mendonça

Hariharan J V [Syncfusion]
Replied On May 14, 2019 04:58 AM UTC

Hi Julio, 
  
Query: I would like to clean only the filter values, I will try to exemplify, imagine that the user typed something wrong and want to clean the fields without closing the screen. I know we could use backspace, but this would be a requirement of the user, that when we click on the 'Clear' button the fields are, say, reset and the filter is still open for filling (with empty fields). I was able to better illustrate my question? 
  
We have validated your query and you want to clear the entered value in the filter dialog without closing it. You can achieve your requirement by using below way. Here, we have bind a button in filter dialog and by using this button, we have cleared the entered text. Please find the below code example and sample for your reference. 
  
[code example] 
<ejs-grid #grid [dataSource]='data' [toolbar]='toolbar' allowPaging='true' allowFiltering='true' [editSettings]='editSettings' [pageSettings]='pageSettings' [filterSettings]='filterSettings' (actionComplete)="complete($event)"> 
        <e-columns> 
            ... 
       </e-columns> 
    </ejs-grid> 
... 
export class AppComponent { 
  public data: Object[]; 
  ... 
  
  complete(args: any): void { 
        var button = document.createElement('button'); 
        button.setAttribute('class', 'e-control e-btn e-lib e-flat'); 
        button.setAttribute('cssClass', 'e-flat'); 
        button.innerHTML = 'clear value'; 
        args.filterModel.dlgDiv.children[1].append(button); 
        button.addEventListener('click', function (e) { 
            (document.getElementsByClassName('e-flmenu-valuediv')[0].children[0].children[0] as any).value = "";    //cleared the entered text 
            (document.getElementsByClassName('e-flmenu-valuediv')[0].children[0].children[1] as any).value = "";    //cleared the entered text 
        }) 
    }} 
  

 
Note: we are not overridden existing clear button, because it's required for clear filtering particular column. If you don't need this clear button then you can hide this.  
  
Please get back to us if you need further assistance. 
  
Regards, 
Hariharan 


Julio Cezar Mendonca
Replied On May 14, 2019 11:57 AM UTC

Worked perfectly. Thank you for your help.

Hariharan J V [Syncfusion]
Replied On May 15, 2019 07:04 AM UTC

Hi Julio,

Thanks for your update.

We are happy to hear that your requirement has been resolved.

Regards,
Hariharan


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon