Advertisement
Guest User

Ajax

a guest
Feb 14th, 2017
231
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. //Все это в разных файлах.
  2. //index.html клиентская часть
  3. <!doctype html>
  4. <html>
  5. <head>
  6. <meta charset="utf-8">
  7. <title>Untitled Page</title>
  8. <meta name="generator" content="WYSIWYG Web Builder 11 - http://www.wysiwygwebbuilder.com">
  9. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  10. <link href="font-awesome.min.css" rel="stylesheet">
  11. <link href="index.css" rel="stylesheet">
  12. <script src="jquery-1.11.3.min.js"></script>
  13. <script src="wb.parallax.min.js"></script>
  14. <script>
  15. $(document).ready(function()
  16. {
  17.    $('#FirstLayer').parallax();
  18. });
  19. </script>
  20.  
  21. </head>
  22. <body>
  23. <div id="FirstLayer">
  24. <div id="FirstLayer_Container">
  25. <div id="ContentLayer">
  26. <div id="ContentLayer_Container">
  27. <div id="PageFooter">
  28. <div id="PageFooter_Container">
  29. </div>
  30. </div>
  31. <div id="LoginLayer">
  32. <div id="LoginLayer_Container">
  33. <div id="wb_Login">
  34. <form name="loginform" method="post" id="loginform">
  35. <input type="hidden" name="form_name" value="loginform">
  36. <table id="Login">
  37. <tr>
  38.    <td class="header"></td>
  39. </tr>
  40. <tr>
  41.    <td class="label"><label for="username">Имя пользователя</label></td>
  42. </tr>
  43. <tr>
  44.    <td class="row"><input class="input" name="username" type="text" id="username" ></td>
  45. </tr>
  46. <tr>
  47.    <td class="label"><label for="password">Пароль</label></td>
  48. </tr>
  49. <tr>
  50.    <td class="row"><input class="input" name="password" type="password" id="password"></td>
  51. </tr>
  52. <tr>
  53.    <td class="row"><input id="rememberme" type="checkbox" name="rememberme"><label for="rememberme">Запомнить меня</label></td>
  54. </tr>
  55. <tr>
  56.    <td style="text-align:center;vertical-align:bottom"><input class="submit" type="submit" name="login" value="Вход" id="login"></td>
  57. </tr>
  58. </table>
  59. </form>
  60. </div>
  61. <div id="wb_TextLogin">
  62. <span style="color:#424242;font-family:Impact;font-size:48px;">Вход</span><br><p>{{title}}</p></div>
  63. </div>
  64. </div>
  65. </div>
  66. </div>
  67. <script>
  68. $(document).ready(function()
  69. {
  70.    $('#loginform').submit(function(e){
  71.         e.preventDefault();
  72.         var username = $('#username').val();
  73.         var password = $('#password').val();
  74.         $.post( "/ajax",{username: username}, function(data) {
  75.             console.log(data);
  76.         }, 'json');
  77.    });
  78. });
  79. </script>
  80. </body>
  81. </html>
  82.  
  83. // серверная часть - index.js
  84.  
  85.  
  86. var express = require('express');
  87. var app = express();
  88. var bodyParser = require("body-parser");
  89.  
  90. var templating = require('consolidate');
  91. app.engine('html', templating.handlebars);
  92. app.set('view engine','html');
  93. app.set('views', __dirname + '/views'); // + '/views'
  94.  
  95. var bParse = bodyParser.urlencoded({extended: false});
  96. var jParse = bodyParser.json();
  97.  
  98. app.use(express.static(__dirname + '/views'));
  99.  
  100. app.get('/', function(req, res){
  101.     res.render('index');
  102. });
  103.  
  104. app.post('/ajax', jParse, function(req, res){
  105.     console.log(req.body.username);
  106.     res.json(`${req.body.username}`);
  107. });
  108.  
  109. app.listen(3000, function () {
  110.   console.log('Example app listening on port 3000!');
  111. });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement