title: Node.JS and Postgres Search Bar
body: <p>Im trying to create a search bar that will query and display the data from my own Postgres database. I have a search bar on my screen, and I think I am connected to my database, but i cannot get any results to show up. Any help would be appreciated. Im still quite new to using node.js and developing tools such as this. When i submit my search, i receive a 404 error message.
  <strong>Index.js</strong></p>
  
  <pre><code>const express = require('express');
  const router = express.Router();
  const pg = require('pg');
  const path = require('path');
  const connectionString = process.env.DATABASE_URL || 'postgres://postgres:postgres@localhost:5432/todo';
  
  
  router.get('/', (req, res, next) =&gt; {
    res.sendFile(path.join(
      __dirname, '..', '..', 'client', 'views', 'index.html'));
  });
  
  router.get('/api/v1/todos', (req, res, next) =&gt; {
    const results = [];
    // Get a Postgres client from the connection pool
    pg.connect(connectionString, (err, client, done) =&gt; {
      // Handle connection errors
      if(err) {
        done();
        console.log(err);
        return res.status(500).json({success: false, data: err});
      }
      // SQL Query &gt; Select Data
      const query = client.query('SELECT name FROM world_heritage_sites.caravanserai ORDER BY iso ASC;');
      // Stream results back one row at a time
      query.on('row', (row) =&gt; {
        results.push(row);
      });
      // After all data is returned, close connection and return results
      query.on('end', () =&gt; {
        done();
        return res.json(results);
      });
    });
  });
  </code></pre>
  
  <p><strong>App.js</strong></p>
  
  <pre><code>const express = require('express');
  const path = require('path');
  const favicon = require('serve-favicon');
  const logger = require('morgan');
  const cookieParser = require('cookie-parser');
  const bodyParser = require('body-parser');
  const routes = require('./server/routes/index');
  // var users = require('./routes/users');
  
  const app = express();
  
  // view engine setup
  // app.set('views', path.join(__dirname, 'views'));
  // app.set('view engine', 'html');
  
  // uncomment after placing your favicon in /public
  //app.use(favicon(path.join(__dirname, 'public', 'favicon.ico')));
  app.use(logger('dev'));
  app.use(bodyParser.json());
  app.use(bodyParser.urlencoded({ extended: false }));
  app.use(cookieParser());
  app.use(express.static(path.join(__dirname, 'client')));
  
  app.use('/', routes);
  // app.use('/users', users);
  
  // catch 404 and forward to error handler
  app.use((req, res, next) =&gt; {
    var err = new Error('Not Found');
    err.status = 404;
    next(err);
  });
  
  // error handlers
  
  // development error handler
  // will print stacktrace
  if (app.get('env') === 'development') {
    app.use((err, req, res, next) =&gt; {
      res.status(err.status || 500);
      res.json({
        message: err.message,
        error: err
      });
    });
  }
  
  // production error handler
  // no stacktraces leaked to user
  app.use((err, req, res, next) =&gt; {
    res.status(err.status || 500);
    res.json({
      message: err.message,
      error: {}
    });
  });
  
  
  module.exports = app;
  </code></pre>
  
  <p><strong>HTML</strong></p>
  
  <pre><code> &lt;!DOCTYPE html&gt;
  &lt;html ng-app="nodeTodo"&gt;
    &lt;head&gt;
      &lt;title&gt;Todo App - with Node + Express + Angular + PostgreSQL&lt;/title&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
      &lt;link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" media="screen"&gt;
      &lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"&gt;
      &lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"&gt;&lt;/script&gt;
      &lt;script src="/search.js" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script src="/search.js"&gt;&lt;/script&gt;
      &lt;script src="//code.jquery.com/jquery-2.2.4.min.js" type="text/javascript"&gt;&lt;/script&gt;
      &lt;script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" type="text/javascript"&gt;&lt;/script&gt;
    &lt;/head&gt;
    &lt;body ng-controller="mainController"&gt;
      &lt;div class="container"&gt;
        &lt;div class="header"&gt;
          &lt;h1&gt;SuckySearchBar&lt;/h1&gt;
          &lt;hr&gt;
          &lt;h1 class="lead"&gt;Designing Search Bars Suck This Never Works&lt;/h1&gt;
        &lt;/div&gt;
      &lt;/body&gt;
      &lt;body ng-controller="searchController"&gt;
        &lt;div class="container"&gt;
          &lt;div class="search-box"&gt;
                  &lt;input class="search" type="text" placeholder="Search" id="search" method='GET' autocomplete="on" onkeyup="search();"&gt;
                  &lt;table class="result table-bordered" id="search"&gt;&lt;/table&gt;
  &lt;script&gt;
                  function searchinput(){
                    $.ajax({
                        type: 'GET',
                        url: '/api/v1/todos' + searchinput,
                        success: function(result){
                            window.location.reload(true);
                        }
                    })
                  }
  
                  &lt;/script&gt;
        &lt;/div&gt;
       &lt;/body&gt;
  &lt;/html&gt;
  
  </code></pre>
  
  <p><strong>Search.js</strong></p>
  
  <pre><code>function search(search_string, func) {
       pool.query(
          "SELECT name FROM world_heritage_sites.caravanserai ORDER BY iso ASC", 
          [search_string],
          function(err, result) {  
              if(err) {
                  func([])
              } else {
                  func(result.rows)
              }
          }
      );
  }
  
  module.export = search;
  </code></pre>