ExpressJS Connection_Reset after Post data input - html

I am doing a json to html work in expressjs but when i post data to search in my file my server restart itself and gives me ERR_CONNECTION_RESET how can i fix it? `
<div>
<form action="/" method="post">
<label for="Search">Please enter the name of the person you want to Search. (Attention capital letters)</label>
<input type="text" name="Search" id="Search">
<button type="submit">Search</button>
</form>
</div>
this is my html search code and this is my expressjs code
app.post("/", function(req,res){
let searching = String(req.body.Search);
let employees1= JSON.parse(fs.readFileSync('./employees.json','utf-8')) ;
let searching_in_employees = employees1.map((emp) => {
if(emp.preferredFullName==searching){
console.log(emp.jobTitleName);}
})
searching_in_employees;
})
`
im getting the console.log(jobtitlename) anyway but this annoying me
I tried to give button refresh page but did not work, still getting the error.

Related

Display modal/alert with loading gif on form submit and redirect when complete

I would like to add a loading gif to my project. I have a HTML form that on submit goes to a PHP file and it builds a table from there. Depending on user input, the query could take awhile to run. I'd like a loading gif to display once the form submit button is clicked until the query is finished running and then redirect to the php script. I think I need to use AJAX if I am not mistaken. When I run the below code, nothing happens. In the console, I can see the Post to the php script was successful and the form data is sent but no redirect and no modal with my loading gif. Any help is extremely appreciated, I am just learning jquery/ajax. Here is what I've managed to code so far..
Jquery
$(function(){
var form = $('#date_range');
$(form).submit(function(e){
e.preventDefault();
var fData = $(form).serialize();
var result = $.ajax({
type: 'POST',
url: 'test_loading_gif.php',
data: fData
});
$('#loader').css("display","flex");
result.done(function(response){
$('#loader').css("display","none");
});
});
});
HTML
<div id="loader"><img src='loading.gif' style='display:none;'></div>
<div style="width: 60%;margin: auto;display: flex;justify-content: center;">
<form id="date_range">
<label for="first_date">Beginning Date:
<input type="date" name="first_date" id="first_date" required>
</label>
<label for="2nd_date">End Date:
<input type="date" name="second_date" id="second_date" required>
</label><br>
<input type="submit" value="Search">
</form>

Cannot POST / With Post request from non '/' site

I am new to Node and am having trouble with the POST functionality.
I have a simple website, where I have the following lines:
app.get('/sign',(req,res)=>{
res.sendFile(path.join(__dirname, 'static', 'index.html'));
});
app.post('/sign', (req,res)=>{
res.send("Success!")
});
The get request works perfectly fine, but when I post the data in the form back, instead of getting a success message, I get Cannot POST /.
When doing the same from the '/' directory with app.get('/', etc.)
it works fine.
This is the content of the 'index.html' file:
<form action = '/' method='POST' id="form">
<div class="form-group">
<label for="emal">Email address</label>
<input type="email" class="form-control" name="email">
</div>
<div class="form-group">
<label for="pwd">Password</label>
<input type="password" class="form-control" name="password">
</div>
<button type="submit" class="btn btn-default">Submit</button>
</form>
The action attribute specifies the URL the form data will be posted to.
You have said to post it to /.
Your server side code provides a route for /sign but not /.
You need your URLs to match. Either change action="/" to action="/sign" to be explicit about where you are posting it to or remove the action attribute entirely so it posts to the current url (which is /sign since that is the route of the GET handler that provided the HTML document containing the form).

Why I am getting GET vars in a POST form?

I have this code:
<?
$page = $_GET['page'];
$find = $_GET['find'];
?>
<form method="post" action="#">
<input type="text" name="whatever" value="1">
<button class="btn btn-default" type="submit">Post this</button>
</form>
My initial URL is:
htttp://www.someplace.com?page=1&find=lookfor
When sending the post form I am getting back "page" and "find" vars along the "whatever" input value. Why? Is this happening because my form action is "#"?
By the way, this is what I want, this saves me the work of posting hidden input values. But I want to be sure it is valid.
Using action="#", you will submit the form to the current URL. Your GET vars are part of this URL so that is why you're getting them again.
More infos on this question.

Express Node JS GET request from HTML

I am taking my first jab at Express Node JS and thoroughly enjoying it. I'm looking to understand how to get first name and last name information input by a user to the server and displaying it in the console log.
My code in HTML is as follows:
<form action = "/getname/" method = "GET">
<p>First name: <input type="text" id="fname" name="firstname"></p>
<p>Last name: <input type="text" id="lname" name="lastname"></p>
<p><input type="button" value="Submit" id="namebutton" /></p>
<p><span id="JSONname"></span></p>
</form>
My code in Express app.js is:
app.get('/getname/', function (req, res) {
response = {
firstname: req.query.firstname,
lastname: req.query.lastname
};
console.log(response);
res.end(JSON.stringify(response));
})
I think the connection between the localhost:xxxx/getname and the server is working, however the html to getname isn't working.
Might anyone see where the code is going wrong?
The submit button must be type="submit" and not type="button".

get input form not as variable but as url

I am building a webservice so people can search into the database. Lets say I have users and companies. Each user and company can be found thought their id. So if you search myurl/users/<id> you get information of that user, on the other hand if you search company/ you get information of that company.
For this I have created two simple input texts (one for users and another for companies) where people can type the <id>. My problem is that when I get the value from the input text I get this myrul/users?<id> and not myurl/users/id. I tried to hardcode the slash but then I get myrul/users/?<id>.
So my question is how can I get input text as a url and not as a variable.
I am using flask so my html has jinja2 code like this:
<!-- USER id -->
<form method='GET' action={{url_for('get_info_by_id', type_collection='user')}}>
<input type="text" name="my_id"/><input type="submit" value="Go">
</form>
<!-- COMPANY id-->
<form method='GET' action={{url_for('get_info_by_id', type_collection='company')}}>
<input type="text" name="my_id"/><input type="submit" value="Go">
</form>
In my python script (flask)
#app.route('myurl/<type_collection>/<my_id>')
get_info_by_id(type_collection,my_id):
# search into the database and return info about that id
As #dirn suggested in the commentary, I made it through JavaScript, here is the code if someone else is also interested:
HTML:
<!-- USER id -->
<form method='GET' class="search" id="user" action="">
<input type="text" name="my_id"/><input type="submit" value="Go">
</form>
<!-- COMPANY id-->
<form method='GET' class="search" id="company" action="">
<input type="text" name="my_id"/><input type="submit" value="Go">
</form>
JS:
$(".search").submit(function( event ){
event.preventDefault();
var my_id = $(this).find(":input").val();
url = 'myurl/'+ $(this).attr("id") + '/' + my_id;
window.location.href = url;
});
python (flask)
#app.route('myurl/<type_collection>/<my_id>')
get_info_by_id(type_collection,my_id):
# search into the database and return info about that id
Is there a reason you cannot use the variable, or are you just trying to get it into a URL so that you can do your search? I went out on a limb and assumed you just want the form and database search to work, so try the following out.
Adjust your route like so:
#app.route('myurl/<type_collection>/')
def findAllTheThings():
if not request.form['my_id']: # Just check if a specific entity is chosen
return render_template('YourTemplateHere') # If no entity, then render form
entity_id = request.form['my_id']
get_info_by_id(type_collection, entity_id):
# search into the database and return info about that id
Now adjust the template as follows:
<!-- USER id -->
<form method='GET' action={{url_for('findAllTheThings', type_collection='user')}}>
<input type="text" name="my_id"/><input type="submit" value="Go">
</form>
<!-- COMPANY id-->
<form method='GET' action={{url_for('findAllTheThings', type_collection='company')}}>
<input type="text" name="my_id"/><input type="submit" value="Go">
</form>
Now, if no entity has been selected you'll just render the form. You can throw in a flash to let them know they need to select a specific ID, or just let them figure it out. If an entity has been selected, you will call the fucntion correctly.