How to create a website with a searchbar to query

问题:

I have a large mongoDB database set up and am trying to create a website where a user can use a searchbar to query the database remotely and have the results posted on the site (strictly read-only).

I have experience with databases for data analysis, but have never created a website for querying results.

I'm don't have any experience with web development and don't know what platforms (PHP? node.js?) to use.

Thanks in advance.

回答1:

There are the following steps to the problem:

1. Create the front-end, which will consist of HTML, CSS, and Javascript. Beginners often find it easiest to work with jQuery and jQuery UI, because they are well-documented and contain plugins for almost all possible scenarios (they should not, however, be used to create large complex applications!). Bootstrap or Foundation can help you with the HTML / CSS.
2. Create a (probably) JSON API, which the front-end can communicate with to submit searches and retrieve results. You could use PHP, Python, Ruby, or many other languages to do this. For a simple site like the one you're describing, it's more a matter of preference than anything else.
3. Translate the search request from the front-end into the MongoDB query APIs, and return the results through the API. You will use a MongoDB client library compatible with whatever language you have chosen.

Depending on your needs, you may be able to eliminate (2) by using an existing REST API for MongoDB.

Note that if you just want to make MongoDB data accessible via searching / charting, then you may be able to avoid coding altogether by leveraging SlamData, an open source project I contribute to. SlamData lets you use Google-style search (or more advanced SQL) to query MongoDB and get the results back in tabular or chart form.

回答2:

I am doing such in nodejs.

In my server side app I have connection via mognoose like:

var mongoose = require('mongoose');
mongoose.connect('mongodb://yourhost/database');

Next you need to have your model to your database

var YourDBVarName = mongoose.model('collectionName', {
  yourfields1 : type,
  yourfields2 : type,
  yourfields3 : type
  ...
});

Then I make GET for it

var express = require('express');
var app = express();
app.get('/dblisting', function(req,res){
   YourDBVarName.find({ yourfieldsX: 'value'}, function(err, data) {
      if(err) {
         res.send(err.message);
      }
      else{
        res.send(data);
      });
});

Then simply you make some GET with $.ajax to yournodeserver.com/dblisting and in response you recive your collection filtered as in

{ yourfieldsX: 'value'}

Ofcourse you may do just {} so you get all your stored data.

回答3:

SLee If you want know about retrieving data from mongoDB, you can use my github https://github.com/parthaindia/CustomMongo .Use getByCondition() method which requires collection name and a Map . The Map can be your queries in form of key value pair,Key being the column name. I use this method when I write search Query for the web development. The java code gives you a Json. Write a Servlet to post your Json to WEB UI.

This is an example to show how to post the retrieved data using Js ,"server_base_url + /server/FetchData" would be your Service URL.The data you has to be appended to a table . Or a span ,depends on what you actually want.The below code appends data

function getdata() {

$.get(server_base_url + "/server/FetchData", {
}).done(function (data) {
    $.each(data, function (index, value) {
        alert("The Index" + index + "The Value" + value);
          $("#11table1").append("<tr><td id='dynamicid1" + index + "'>" + value + "</td></tr>");
    });

});

}

This function can be used for defining table

function defineTable() {

$("#mainDivID").text("").append("<div id='contpanel' class='contentpanel'>");
$("#contpanel").append("<div id='rowid11' class='row'>");
$("#rowid11").text("").append("<div id='row11table1' class='col-md-12'>");
$("#row11table1").text("").append('<br /><br /><center><h5 class="lg-title mb5" style="background-color:#428BCA;height:20px;color:#fff;padding-top:4px;"><b>Heading</b></h5></center>');
$("#row11table1").append("<div id='table11id1' class='table-responsive'>");
$("#table11id1").append("<table id='11table1' class='table table table-bordered mb30' >");
$("#11table1").append("<thead><tr><th>Index</th><th>Value</th></tr></thead>");

}