JavaScript: modify form when user submits

Question

When user clicks submit on a form, I want to modify the contents of one field and then submit. I've now tried about 20 different ways to do this, but none of them work. I'm able to recognize the submit event, cancel it, and modify the fields, but I'm unable to submit the form again in the same event. My latest attempt was with JQuery:

    $("form").submit(function (e) {
        e.preventDefault();
        var element = document.getElementById("categorySafari");
        var selection = element.options[element.selectedIndex].text;
        document.getElementById("category").value = selection;
        this.submit(); // <-- this doesn't work and nothing I've tried here works
    });

of course you can't submit, you cancel each submit! heh... infinite loop? use a flag of some sort to determine if the cleanup has run on not, and don't preventDefault() if it's clean. — dandavis
– dandavis, Commented Jan 8, 2017 at 15:31
I think that you enter an infinite recursion because you always cancel the default behavior. You should change some attribute of the submit event in order to not cancel the default after the first reentry — lucianopaz
– lucianopaz, Commented Jan 8, 2017 at 15:38
There was no infinite loop. I got infinite loop earlier by using $("form").submit(); at the last line. This way it's just unable to call the submit function at all. — bkoodaa
– bkoodaa, Commented Jan 8, 2017 at 15:40

james_bond · Accepted Answer · 2017-01-08 15:57:18Z

1

Remove the e.preventDefault() and the this.submit() call. That is preventing the form submission.

edited Jan 8, 2017 at 15:57

answered Jan 8, 2017 at 15:35

james_bond

6,9263 gold badges30 silver badges39 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Barmar Over a year ago

And also remove this.submit(), since the form will be submitted automatically.

Avihay m · Accepted Answer · 2017-01-08 15:28:16Z

0

Maybe try to put onClick event to your submit button and call function to handle your fields then from this function call submit form event.
Here is how you can trigger form with js

answered Jan 8, 2017 at 15:28

Avihay m

5511 gold badge6 silver badges23 bronze badges

Comments

Swergas · Accepted Answer · 2017-01-08 15:39:49Z

0

I've tried your code and it works correctly for me (Ubuntu+Chromium): http://codepen.io/swergas/pen/qROWbY

Values Posted

categorySafari  volvo
category    Volvo

answered Jan 8, 2017 at 15:39

Swergas

3724 silver badges9 bronze badges

Collectives™ on Stack Overflow

JavaScript: modify form when user submits

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related