react-native-search-list
react-native-search-list copied to clipboard
How can I select a row i need selected items
Is there any option ?? I am getting selected items but i cannot add Active class to it ..
I have added a indexNum and isSelected(bool) to my array
renderRow (item, sectionID, rowID, highlightRowFunc, isSearching) {
return (
<Touchable onPress={() => {
this.addToSelectedItem(item.indexNum);
}}>
<View key={rowID} style={{flex: 1, marginLeft: 20, height: rowHeight, justifyContent: 'center'}}>
<View style={this.state.dataSource[item.indexNum].isSelected ? {backgroundColor:'red'} : null}>
<HighlightableText
matcher={item.matcher}
text={item.searchStr}
textColor={'#000'}
hightlightTextColor={'#0069c0'}
/>
</View>
</View>
</Touchable>
)
}
it is selecting after a hot re-load .
Custom your own renderRow and use a flag in the row data item may help.
@erichua23 can you give a hint how to do that? I'm stuck there as well. I have a "selected" flag that changes when the row is selected, but i noticed that the function renderRow never gets called (re-rendered) when i use forceUpdate() inside selectItem function. The only time the background of the selected row changes, is when i'm searching (keyboard opened). Is this a bug or something is missing?
@Phuzer Have you solved this problem? I have the same problem now.
It works for me
pressItem = item => {
let index = this.state.dataSource.findIndex(element => {
return element.id === item.id
})
if (index === -1) return
const { dataSource } = this.state
const data = immutable(dataSource, {
[index]: { checked: { $set: !item.checked } }
})
this.setState({ dataSource: data })
}
renderRow = (item, sectionID, rowID, highlightRowFunc, isSearching) => {
return (
<TouchableOpacity onPress={() => this.pressItem(item)}>
<View
key={rowID}
style={{
flex: 1,
marginLeft: 20,
height: rowHeight,
justifyContent: 'center',
backgroundColor: item.checked ? 'red' : 'white'
}}
>
{/* use `HighlightableText` to highlight the search result */}
<HighlightableText
matcher={item.matcher}
text={item.PerName}
textColor={'#000'}
hightlightTextColor={'#0069c0'}
/>
</View>
</TouchableOpacity>
)
}