I am trying to pass python json results to html ajax from node js.
What I want to make is, take some inputs from the client side, and when a submit button is hit, ajax is sending the variables to Node JS then the /data middleware runs a python script which handles the DB and stores the variables and showing the results.
What I did so far is, I can take inputs from the client side, and send the variables from html to Node JS using ajax, and I can also run the python script and it stores the variables to my DB. I can see the results from the back end side. But I do not know how to send back the results to the ajax client side.
Below is my part of back end side Node JS code.
const express = require('express'); const app = express(); // To use python script var PythonShell = require('python-shell'); const bodyParser = require('body-parser'); // parse application/x-www-form-urlencoded app.use(bodyParser.urlencoded({ extended: true })); // parse application/json app.use(bodyParser.json()); app.use(express.static(__dirname + '')); app.use(express.json()); app.engine('html', require('ejs').renderFile); app.get('/data', function(req, res) { res.sendFile(__dirname + '/data.html'); }); app.post('/data', function(req, res) { const {name, ssn, state} = req.body; console.log('name: ',name, 'ssn: ',ssn,'state: ',state); var options = { mode: 'json', pythonPath:'', pythonOptions:['-u'], scriptPath:'', args: [name,ssn,state] }; PythonShell.PythonShell.run('dbPrac.py', options, function(err, res) { if(err) throw err; console.log('res[0]: ', res[0]); //res.render(__dirname + '/data.html'); res.send(res[0]); //res.status(200).send(res[0]); }); });
When I use “res.” method, back end side compiler always says “TypeError: res.send is not a function”
Below is my part of java script
<script> function sendAjax() { console.log('submit onclick.'); const name = document.getElementById("name").value; const ssn = document.getElementById("ssn").value; const state = document.getElementById("state").value; console.log('name: ',name, 'ssn: ',ssn,'state: ',state); $.ajax({ type: "post", url: 'http://localhost:8080/data', data: {name:name,ssn:ssn,state:state}, dataType:'json', success: function(res) { console.log(res); } }); } </script>
Below is my part of html file in case that needed.
<form action="http://localhost:8080/data" method="post" id="signup"> <h1>Personal info post example</h1> <div class="field"> <label for="name">Name:</label> <input type="text" id="name" name="name" placeholder="Enter your fullname" /><br><br> <small></small> </div> <div class="field"> <label for="ssn">SSN:</label> <input type="text" id="ssn" name="ssn" placeholder="Enter your SSN" /><br><br> <small></small> </div> <div class="field"> <label for="state">State:</label> <input type="text" id="state" name="state" placeholder="Enter your state" /><br><br> <small></small> </div> <button type="submit" onclick="sendAjax()">Submit</button><br><br> <span id="answer"></span> <br><br> </form>
Advertisement
Answer
try changing arguments in python results callback:
PythonShell.PythonShell.run('dbPrac.py', options, function(err, pythonRes) { if(err) throw err; console.log('pythonRes[0]: ', pythonRes[0]); //res.render(__dirname + '/data.html'); res.send(pythonRes[0]);