Thursday, May 23, 2024
 Popular · Latest · Hot · Upcoming
49
rated 0 times [  50] [ 1]  / answers: 1 / hits: 9532  / 10 Years ago, fri, may 30, 2014, 12:00:00

I am having my sign in and registration form both in the same page. I have specified two different routes for posting the data but it saves sign-in form inputs (which are none) when I hit the register button at the end of the registration form? I looked at this question(Multiple forms and one processing page). How would it work with node, would that means I have to create a module for different forms?



Here is my code. I have a small script at the end also because the slider function of my bootstrap template was clashing with the submit function.



<h2>Register<h2>
<form method=POST action=/samples>
<input type=text name=fullName id=fullName class=input-lg placeholder=your full name data-required=true>
<input type=text name=age id=age class=input-lg placeholder=age>
<input type=text name=city id=city class=input-lg placeholder=Your City>
<input type=text name=job class=input-lg placeholder=Your Job>
<input type=text name=username class=input-lg placeholder=prefered username data-required=true>
<input type=password name=password class=input-lg placeholder=Password>
<input type=email name=email class=input-lg placeholder=your email data-required=true>
<button type=submit class=btn btn-primary>Sign in</button>
</form>

<h2>Login!</h2>
<form method=POST action=/dashboard>
<hr class=colorgraph>
<input type=email name=emaillog class=input-lg placeholder=your email data-required=true>
<input type=password name=passwordlog class=input-lg placeholder=Password>
<button type=submit class=btn btn-primary>Sign in</button>
</form>

<script>
$('button').click( function() {
$('form').submit();
});
</script>


Thanks for your help


More From » node.js

 Answers
8

Well, first off because you have two forms, you have to specify which form to submit on a button click.
Right now any button click would submit just the first form.
Give first form's submit button class registerButton and second form's submit class loginButton.
I would also suggest giving classes to your forms. One will be registerForm, another is loginForm.
Then change your HTML to reflect the changes



<form method=POST action=/samples class=registerForm> 
...
<button type=submit class=btn btn-primary registerButton>Sign in</button>
<form method=POST action=/dashboard class=loginForm>
...
<button type=submit class=btn btn-primary loginButton>Log in</button>


Then change your javascript to this:



    $('button.registerButton').click( function() {
$('form.registerForm').submit();
});
$('button.loginButton').click( function() {
$('form.loginForm').submit();
});


Now you are able to submit two forms to two different routes.

One form would go to samples and the other to dashboard, so on your server (in Node) you can check which route it is.
I would suggest using one of the Node frameworks to work with your application.
You can try Express. It will drastically simplify your work with routes.
It will allow you to write routes as easy as this:



app.post('/samples', function(req, res){
// check register form
// res.send('user' + req.body);
});
app.get('/dashboard', function(req, res){
// check login form
// res.send('user' + req.body);
});


You can read more on Express from a suggested list here.


[#44922] Thursday, May 29, 2014, 10 Years  [reply] [flag answer]
Only authorized users can answer the question. Please sign in first, or register a free account.
milor

Total Points: 284
Total Questions: 93
Total Answers: 115

Location: Venezuela
Member since Thu, Jul 15, 2021
3 Years ago
milor questions
;