1

I have created a database using SQL and I have a functional web page built on Angular and nodejs which is connected to the database. I need to make the search bar functional. How should I proceed?

the_new_guy
  • 147
  • 1
  • 5
  • 17
  • Can you be more precise about your question, anything you have tried so far? You can also check out this answer https://stackoverflow.com/questions/47439195/implement-search-functionality-node-js-mysql – Sunil Lulla Nov 05 '19 at 12:29
  • Proceed by doing some research and writing some code. Find out how to use angular to submit form data to the server and get the results. Ask us again if you have a more specific question...this is too vague, especially as we can't even see the work you've done so far – ADyson Nov 05 '19 at 12:51

1 Answers1

9

Create a input box in html with keyup event as :

<input (keyup)="searchData($event)" type="text" class="form-control" placeholder="Search"
          aria-label="Searchbox" aria-describedby="basic-addon1">

Add this function in your .ts file which will be triggered on keyup in search box :

searchData(event) {
    this.search = event.target.value
    console.log(this.search)
    console.log(this.filter)
    this.empService.searchData(this.search).subscribe((res) => {
      console.log("Filter Response", res);
      if (res) {
        this.employees = res
        if (res.length === 0) {
          this.noData = true
        } else {
          this.noData = false
        }
      }
    },
      (err) => {
        console.log(err);
        console.log("error")
      })
  }

Create a service to call your api in node : 

searchData(data): Observable<any> {
    return this.http.get(environment.serverUrl + 'searchData?search=' + data).pipe(

      catchError((error: HttpErrorResponse) => throwError(error))
    )
  }

Write a api in node as : 

let searchData = (req, res) => {
    search = req.query.search
    console.log(search)
    var searchEmployees = `SELECT * FROM employees WHERE (employeeNo LIKE '%${search}%' OR name LIKE '%${search}%' OR email LIKE '%${search}%' OR contact LIKE '%${search}%') AND isDeleted='0' `
    //searchValues = [search,search,search,search]
    console.log(searchEmployees)
    db.query(searchEmployees, function (errQuery, resQuery) {
        if (errQuery) {
            res.send(errQuery)
        } else {
            res.send(resQuery)
        }
    })
}

Edit sql query as per your table structure and name.

Vipulw
  • 1,253
  • 5
  • 12