2 * ============LICENSE_START=======================================================
4 * ================================================================================
5 * Copyright © 2017-2021 AT&T Intellectual Property. All rights reserved.
6 * ================================================================================
7 * Licensed under the Apache License, Version 2.0 (the "License");
8 * you may not use this file except in compliance with the License.
9 * You may obtain a copy of the License at
11 * http://www.apache.org/licenses/LICENSE-2.0
13 * Unless required by applicable law or agreed to in writing, software
14 * distributed under the License is distributed on an "AS IS" BASIS,
15 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
16 * See the License for the specific language governing permissions and
17 * limitations under the License.
18 * ============LICENSE_END=========================================================
21 import React, {Component} from 'react';
22 import DropdownButton from 'react-bootstrap/lib/DropdownButton';
23 import MenuItem from 'react-bootstrap/lib/MenuItem';
25 class SelectFilter extends Component {
27 console.log('SelectFilter props',props);
30 this.state = {dropdownIsOpen : false, isInitialize: true}
32 componentWillReceiveProps (nextProps) {
33 console.log('next props componentWillReceiveProps>>>>>>>',nextProps);
34 console.log('tihs props componentWillReceiveProps>>>>>>>',this.props);
35 if(this.state.isInitialize || this.props.id !== nextProps.id){
37 this.setState({isInitialize:false},()=>{this.updateDropDownState();});
39 console.log('this.state under Update>>>>>',this.state);
42 handleDropdownValues = (props) => {
43 const listItems = Object.keys(props.filterList).map((filter,index) => {
44 let filterValue=(props.filterList[index].value)?props.filterList[index].value:props.filterList[index];
45 let description=(props.filterList[index].description)?props.filterList[index].description:'';
47 <MenuItem eventKey={index} key={index} title={description}>{filterValue}</MenuItem>
50 console.log('listItems',listItems);
55 toggleDropdown = () => {
56 console.log('toggleDropdown>>>>>',this.state.dropdownIsOpen);
57 this.setState({ dropdownIsOpen: !this.state.dropdownIsOpen },()=>{this.updateDropDownState();});
59 updateDropDownState = () =>{
60 console.log('updateDropDownState',this.state.dropdownIsOpen);
61 //document.dispatchEvent(new MouseEvent('click'));dropdownIsOpen
62 let id=(this.props.id)? 'dropdown-root-'+this.props.id :'dropdown-root-1'
63 if(this.state.dropdownIsOpen){
64 document.getElementById(id).getElementsByClassName('dropdown-menu')[0].style.display='block';
66 document.getElementById(id).getElementsByClassName('dropdown-menu')[0].style.display='none';
69 handleSelect(eventKey, event) {
70 Object.keys(this.props.filterList).map((filter,index) => {
71 if(eventKey === index){
72 let filterValue=(this.props.filterList[index].value)?this.props.filterList[index].value:this.props.filterList[index];
73 this.props.onMenuSelect(filterValue,this.props.id)
78 if(this.state.isInitialize){
79 this.setState({isInitialize:false},()=>{this.updateDropDownState();});
82 <div id={(this.props.id)? 'dropdown-root-'+this.props.id :'dropdown-root-1'}>
85 title= {(this.props.selectedFilter)? this.props.selectedFilter: this.props.param.filterDisplay}
87 id={(this.props.id)? 'dropdown-basic-'+this.props.id :'dropdown-basic-1'}
88 className='dropdownButton'
89 onToggle={this.toggleDropdown}
90 onSelect={this.handleSelect.bind(this)}
93 this.handleDropdownValues(this.props)
100 export default SelectFilter;