CODEWITHSUNDEEP
javascriptnode.jsformsform-submit
Saad
Saad

Reputation: 1360

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

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.

Upvotes: 0

Views: 1008

Answers (1)

Antoinette Authedna
Antoinette Authedna

Reputation: 86

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);
            }
        }
    }
}

Upvotes: 1

Related Questions