Home > Developer > Web Develop
Effect Demo:
First, using Nodejs to build the background environment, through the Ajax get method to the text box value, real-time transmission to the background for comparison, back to the background, the results returned to the UL
1, create a route
App4.js
/** * Created by Dyb on 2018/1/2.*/varExpress = require (' Express ');varfs= require (' FS ');varurl = require (' URL '));varApp =Express ();varMySQL = require (' MySQL ');/*app.engine ('. html ', require (' Ejs '). __express);*/App.set (' View engine ', ' Ejs '); App.set (' Views ', __dirname + '/views '); App.use (Express.static (__dirname+ "/public"));varRouter=Express. Router ();
Direct access to the template's Routing App.get ('/ee/* ',function(req, res,next) {varPagepath=Url.parse (req.url). Pathname; if(Pagepath.indexof (". Ejs")!=-1) {Pagepath=PAGEPATH.SUBSTR (1); Pagepath=pagepath.substr (0,pagepath.length-4); Res.render (Pagepath); }Else{next (); }});
The route usedvarScfk=require ('./action/scfk.js ')); App.use ("/",NewSCFK (Express) router); App.listen (3001,functionAfterlisten () {Console.log ("Express running ...");});
2. Building a module for processing data
Scfk.js
/** * Created by Dyb on 2018/1/2.*/varDb=require ('./db.js '));//to create a new database method objectvardb=NewDb ();functionSCFK (Express) {//Create a route This. Router =Express. Router (); varCsql = "SELECT * FROM SCFK"; //creating a connection from an object call function /*<% Args.foreach (function (row) {var aa=row.substring (0,test.length); if (aa.equals (test)) {%> <li><%=row%></li> <%}})%>*/ //Call function to receive data This. Router.get ("/action/scfk.js?",function(req,res) {//getting data from a databaseDb.excutequery (Csql,function(data) {//req.query: Gets the query parameter string for the URL varPar=Req.query; if(PAR.SS) {varSk= ""; //comparing data in a traversal database with URL parameter stringsData.data.forEach (function(Row) {Console.log (ROW.SC_VL); //intercepting data in a database varAa=row.sc_vl.substring (0, par.ss.length); Console.log (AA+" "+PAR.SS); //Compare the parameters and whether the data captured in the database is one to if(par.ss==AA) {console.log (row); SK+=row.sc_vl+ ","; } }); //send data to a pageRes.send ({"Args": SK}); }})}module.exports=SCFK;
3. Building a module to access the database
Db.js
/** * Create a database connection and get the data*/varMySQL = require (' MySQL ');(functionDb () {varPool =Mysql.createpool ({host:' localhost ', User:' Dyb ', Password:' 1743721550 ', Database:' Test ', Port:3306, Acquiretimeout:10000, Connectionlimit:10 }); Db.prototype.excuteQuery=function(sql,callback) {pool.getconnection (function(Err,con) {if(err) {Throw"Data Connection exception:" +err; }Else{con.query (SQL,function(err,rows) {//Release Connectioncon.release (); varResult= ""; if(err) {result= { "Status": "500", "Message": "Database query Statement exception" } }Else{result= { "Status": "200", "Message": "Success", "Data": Rows}} Callback (result); }); } }); } module.exports=Db;} ());
5,ejs View
Ajssk.ejs
<!DOCTYPE HTML><HTMLxmlns= "http://www.w3.org/1999/html"><HeadLang= "en"> <MetaCharSet= "UTF-8"> <title></title></Head><Scriptsrc=".. /js/jquery.min.js "></Script><Scripttype= "Text/javascript"> functionAA () {//get the current value of the matching element varTest=$("#ee"). Val (); Console.log (test); vartext=""; //use the Get method to send the value in the element and use the callback function to receive and process$.get (".. /action/scfk.js", {ss:test},function(data) {Console.log (Data.args); //Split String varQQ=Data.args.split (","); Console.log (QQ); //The loop received parameter is assigned to text for(varI=0; I<Qq.length;i++) {text+="<li style= ' >"+Qq[i]+"</li>"; } /*$.each (qq,function (row) {text+= "<li>" +row+ "</li>"; });*/ //HTML adds text to a node with an ID of SS $("#ss"). html (text); }) }</Script><Body><inputtype= "text"Oninput= "AA ()"ID= "ee"><inputtype= "button"value= "Search"><ulstyle= "margin:0px 0px;list-style:none; width:171px;border:1px solid;padding:0px"ID= "ss"></ul></Body></HTML>
Js:ajax's Get method implements a simple search box hint
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
