bisu-react-row-search React component
npm install bisu-react-row-search[![Travis][build-badge]][build]
[![npm package][npm-badge]][npm]
[![Coveralls][coveralls-badge]][coveralls]
Describe bisu-react-row-search here.
[build-badge]: https://img.shields.io/travis/user/repo/master.png?style=flat-square
[build]: https://travis-ci.org/user/repo
[npm-badge]: https://img.shields.io/npm/v/npm-package.png?style=flat-square
[npm]: https://www.npmjs.org/package/npm-package
[coveralls-badge]: https://img.shields.io/coveralls/user/repo/master.png?style=flat-square
[coveralls]: https://coveralls.io/github/user/repo
``js
import React, { Component } from 'react'
import { connect } from 'react-redux'
import { fromJS } from 'immutable'
import { Form, actions } from 'react-redux-form/immutable'
import { Fieldset } from 'tforms'
import SearchModal, {
ResultWrapper,
ResultHeader,
ResultItemWrapper,
ResultSpan,
} from 'bisu-react-search-modal'
import ThisComponent from '../../src'
import SearchResultItem from './search-result-item'
import { searchStudent } from './actions'
const intRequired = val => {
return val > 0
}
const validators = {
student_id: { intRequired },
}
class DemoAjax extends Component {
constructor(props) {
super(props)
this.state = {
openSearch: false,
}
}
_onSubmit = payload => {
console.log('submit', payload.toJS())
}
_openSearch = () => {
this.setState({ openSearch: true })
}
_closeSearch = () => {
this.setState({ openSearch: false })
}
_onSearch = search => {
this.props.dispatch(searchStudent(search.get('q')))
}
_onDirectSearch = term => {
this.props.dispatch(searchStudent(term)).then(res => {
if (res.payload.data && res.payload.data.length > 0) {
this._onSelectItem(fromJS(res.payload.data[0]))
} else {
this._reset()
}
})
}
_onSelectItem = item => {
// set the models
// model0="formState.student_id"
// model1 = 'formState.student_id_input'
// model2 = 'formState.student_name'
const { dispatch } = this.props
dispatch(actions.change('formState.student_id', item.get('id')))
dispatch(actions.change('formState.student_id_input', item.get('code')))
dispatch(
actions.change(
'formState.student_name',
item.get('id') + ' - ' + item.get('name')
)
)
this._closeSearch()
}
_reset = () => {
const { dispatch } = this.props
dispatch(actions.change('formState.student_id', 0))
dispatch(actions.change('formState.student_id_input', ''))
dispatch(actions.change('formState.student_name', ''))
}
_renderResults() {
const searchResults = this.props.__student.get('searchResults')
if (!searchResults || searchResults.size === 0) {
return null
}
return (
{searchResults.map((item, k) =>
item={item}
onSelectItem={this._onSelectItem}
/>
)}
)
}
render() {
const { openSearch } = this.state
const searching = this.props.__student.get('searching')
return (
function mapStateToProps(state) {
return {
__student: state.student,
}
}
export default connect(mapStateToProps)(DemoAjax)
``