node.js: How to differentiate between two forms on server side?

Question

I have two forms on my html page:

<form id="enterForm" action="/" enctype="multipart/form-data" method="post">
    <fieldset>
        <textarea id="queries" name="queries"></textarea><br />
        <input type="submit" value="submit" />
    </fieldset>
</form>
<form id="uploadForm" action="/upload" enctype="multipart/form-data" method="post">
    <fieldset>
        <input type="file" name="upload"><br />
        <input type="submit" value="Upload">
    </fieldset>
</form>

On the server side, I have to call corresponding functions based on which form's submit button was pressed.

Currently, I am doing like this:

var server = http.createServer(function (req, res) {
    if (req.url == '/upload' && req.method.toLowerCase() == 'post') {
        processFile(req, res);
    }
    else if (req.method.toLowerCase() == 'post') {
        processField(req, res);
    }
}

My question is, is there any other way for server to find out which form's submit button was pressed? Ideally, I would like to keep the url same for both the forms.

A dumb and easy solution is to put a hidden input inside each form that identifies the form. — user2867288, Jan 12 '16 at 22:38
Can you let me know what should be written in the server side to read that hidden input? — SaadH, Jan 12 '16 at 22:48
This is a different question, it will be listed in your POST data, assuming `. You would look for "formName" in the POST. http://stackoverflow.com/questions/4295782/how-do-you-extract-post-data-in-node-js — user2867288, Jan 12 '16 at 22:51
Different `action` urls and different input names should suffice to distinguish them, shouldn't they? — Bergi, Jan 12 '16 at 23:41
@Bergi I want to keep same urls. As pointed out by user286... , hidden input solves the problem. — SaadH, Jan 13 '16 at 00:04
You should think about using [`express`](http://expressjs.com/), then you could just distinguish them by their `action`. — Patrick Roberts, Jan 13 '16 at 00:54

score 1 · Accepted Answer · edited Jan 13 '16 at 00:50

You could have a hidden form field on each form.

<form id="enterForm" action="/" enctype="multipart/form-data" method="post">
<fieldset>
    <textarea id="queries" name="queries"></textarea><br />
    <input type="hidden" name="formInstance" value="form1" />
    <input type="submit" value="submit" />
</fieldset>
</form>
<form id="uploadForm" action="/" enctype="multipart/form-data" method="post">
<fieldset>
    <input type="file" name="upload"><br />
    <input type="hidden" name="formInstance" value="form2" />
    <input type="submit" value="Upload">
</fieldset>
</form>

Then on the server, you could parse the request body to see what value is assigned to formInstance. However, this requires quite a few lines of code if you're not using a module to help parse the body. So, you might want to use a module like node-formidable. Then you could do something like the following.

var server = http.createServer(function (req, res) {
    if (req.url == '/' && req.method.toLowerCase() == 'post') {
        var form = new formidable.IncomingForm();
        form.parse(req, function(err, fields, files) {
            if(fields.formInstance == 'form1') {
                processField(req, res); 
            }
            else if(fields.formInstance == 'form2') {
                processFile(req, res);
            }
        }
    }
}

Thanks. This is what I was looking for. – SaadH Jan 13 '16 at 00:02 — SaadH, Jan 13 '16 at 00:02

node.js: How to differentiate between two forms on server side?

1 Answers1