From 89b4e6dc105258f3c472b6c2caf29dbadfff576f Mon Sep 17 00:00:00 2001 From: Menaka Jayawardena Date: Mon, 28 Aug 2017 15:09:36 +0530 Subject: [PATCH] Application search feature for data table. Basic stage. --- .../Application/ApplicationListing.js | 19 ++++++++++++++++--- .../src/components/UIComponents/DataTable.js | 8 ++++++++ 2 files changed, 24 insertions(+), 3 deletions(-) diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/ApplicationListing.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/ApplicationListing.js index e3f4e60819..56e3a83282 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/ApplicationListing.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/Application/ApplicationListing.js @@ -111,14 +111,27 @@ class ApplicationListing extends Component { componentWillMount() { //Fetch all the applications from backend and create application objects. + this.setState({data: this.data}); } /** * Handles the search action. * When typing in the search bar, this method will be invoked. * */ - _searchApplications(word) { - let searchedData = []; + _searchApplications(event, word) { + let searchedData; + if (word){ + searchedData = this.data.filter((dataItem) => { + return dataItem.applicationName.includes(word); + }); + } else { + console.log("no") + console.log(this.data) + searchedData = this.data; + } + + this.setState({data: searchedData}, console.log("Searched data ", this.state.data)); + } /** @@ -155,7 +168,7 @@ class ApplicationListing extends Component { diff --git a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/UIComponents/DataTable.js b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/UIComponents/DataTable.js index 0c558b8f8d..f14a8dbb39 100644 --- a/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/UIComponents/DataTable.js +++ b/components/application-mgt/org.wso2.carbon.device.application.mgt.publisher.ui/src/main/resources/publisher/src/components/UIComponents/DataTable.js @@ -63,6 +63,12 @@ class DataTable extends Component { this.setState({data: this.props.data, headers: this.props.headers}) } + shouldComponentUpdate(nextProps, nextState) { + console.log("next Props", nextProps.data); + this.setState({data: nextProps.data}); + return true; + } + /** * Triggers when user click on table row. * This method invokes the parent method handleRowClick, which is passed via props. @@ -75,6 +81,8 @@ class DataTable extends Component { render() { const {data, headers} = this.state; + console.log(data); + let noDataContent = null; if (this.props.noDataMessage.type === 'button') {