This is a migrated thread and some comments may be shown as answers.

DropdownList - Clear filter

9 Answers 698 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Lori
Top achievements
Rank 1
Lori asked on 09 May 2019, 08:13 AM

I have a dropdown list thats populating from Graph.

Just wondering how can I clear the filter?

9 Answers, 1 is accepted

Sort by
0
Lori
Top achievements
Rank 1
answered on 09 May 2019, 09:56 AM
And set the selected value to -1
0
Vasil
Telerik team
answered on 13 May 2019, 07:05 AM
Hi Lori,

Could you give an example of how your data is structured?

Regards,
Vasil
Progress Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
Lori
Top achievements
Rank 1
answered on 14 May 2019, 11:18 AM

Hi Vasil

Apologises for the delay in coming back to you.

My data is pulled from the Microsoft Graph and populates an array

___________________________________

resultData.d.results.forEach (
views => {
this.MYARRAY. push ({
    key: mykey,
text: myText
});
});

_________________________________

My kendo dropdown list is as follows

<DropDownList
name="myDropDown"
data={this.state.selected}
textField="text"
filterable={true}
onFilterChange={this.filterChange}
onChange = {(event) => this.handleChange('event.target.value) }

style={{ width: "300px" }}
/>

 

0
Lori
Top achievements
Rank 1
answered on 14 May 2019, 11:25 AM

my Clear for the drop down is

Selected: this.MYARRAY.slice(),

______________________________

Ive also tried

Selected: {"key": ''; "text": ''}

but doesnt work

______________________

 

0
Lori
Top achievements
Rank 1
answered on 14 May 2019, 01:06 PM

its pretty much 

https://www.telerik.com/kendo-react-ui/components/dropdowns/dropdownlist/filtering/

this sample from the stie

0
Stefan
Telerik team
answered on 15 May 2019, 07:12 AM
Hello, Lori,

The filter value can be controlled using the filter prop of the DropDown.

https://www.telerik.com/kendo-react-ui/components/dropdowns/api/DropDownListProps/#toc-filter

I made an example showcasing how to clear the filter value:

https://stackblitz.com/edit/react-pew4cw?file=app/main.jsx

I hope this is helpful.

Regards,
Stefan
Progress Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
Lori
Top achievements
Rank 1
answered on 15 May 2019, 09:43 AM

Thanks for that Stefan - how can I also clear the selection? When I hit clear in the example its still set?

 

0
Lori
Top achievements
Rank 1
answered on 15 May 2019, 11:42 AM
Its ok got it : https://react-pew4cw-3qdij6.stackblitz.io
0
Stefan
Telerik team
answered on 15 May 2019, 12:25 PM
Hello, Lori,

I'm glad to hear that the issue is resolved.

For anyone else finding this thread on the later state, I want to clarify that this is done by setting the DropDownList in controlled mode and resetting the value:

https://www.telerik.com/kendo-react-ui/components/dropdowns/dropdownlist/binding/#toc-value-binding

Regards,
Stefan
Progress Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Tags
General Discussions
Asked by
Lori
Top achievements
Rank 1
Answers by
Lori
Top achievements
Rank 1
Vasil
Telerik team
Stefan
Telerik team
Lori
Top achievements
Rank 1
Share this question
or