Simulate Pressing Enter Key to Submit (NO jquery)

Question

I'm trying to figure out a way to submit what's in the textbox automatically by simulating hitting Enter Key.
We want to avoid using submit() so I'm trying to find a way to submit by simulating enter key.

I want to use strict Javascript without jquery.

Would you be able to review the code below and how I can simulate hitting Enter Key after populating the value in the text box?

I'm new to Javascript so please be patient with me. Let me know if you need anything.

This is my current script:

//Find reason then populate text box function FillText() { var TextField = document.getElementsByName("reason"); TextField[0].value = "TEST"; } var delayInMilliseconds = 6000; //6 second setTimeout(function() { FillText(); }, delayInMilliseconds);

How should I modify FillText function so it would work? (Compared to my original script?)

//Find reason then populate text box function FillText() { var TextField = document.getElementsByName("reason"); TextField[0].value = "TEST"; var evt = new KeyboardEvent("keydown", { bubbles: true, cancelable: true, keyCode: 13 }); TextField[0].dispatchEvent(evt); }

Edit / Note: Most of the previous posts refer to initKeyboardEvent which applies to Firefox. I'm looking for one that will work with Chrome and with other browsers using strictly Javascript.

This may be useful: stackoverflow.com/questions/17323279/… — Mohamed Farouk
– Mohamed Farouk, Commented Jan 30, 2020 at 4:14
Does this answer your question? Simulate keypress without jquery — gforce301
– gforce301, Commented Jan 30, 2020 at 4:26
@gforce301 I already searched for quite a bit but most of them had initKeyEvent which only applies to Firefox. How would I modify the script? function FillText() { var TextField = document.getElementsByName("reason"); TextField[0].value = "TEST"; var evt = new KeyboardEvent("keydown", { bubbles: true, cancelable: true, keyCode: 13 }); TextField[0].dispatchEvent(evt); } — casao01
– casao01, Commented Jan 30, 2020 at 6:07
@gforce301 I did search and most of the posts use initKeyEvent which applies to Firefox and it has been deprecated. I'm trying to find one that applies to Chrome (mainly) and all other browsers. — casao01
– casao01, Commented Jan 30, 2020 at 6:15
Read this: keyboardEvent and this: EventTarget.dispatchEvent() if you need to understand the answer given by Grey Chanel. — gforce301
– gforce301, Commented Jan 30, 2020 at 6:26

Grey Chanel · Accepted Answer · 2020-01-30 04:20:58Z

1

Try this:

var evt = new KeyboardEvent("keydown", { bubbles: true, cancelable: true, keyCode: 13 }); element.dispatchEvent(evt);

answered Jan 30, 2020 at 4:20

Grey Chanel

2121 silver badge5 bronze badges

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

4 Comments

casao01 Over a year ago

Where would I be putting this in my script? I would like to modify FillText function. Is this how I should be modifying my script?

function FillText() { var TextField = document.getElementsByName("reason"); TextField[0].value = "TEST"; var evt = new KeyboardEvent("keydown", { bubbles: true, cancelable: true, keyCode: 13 }); TextField[0].dispatchEvent(evt); }

casao01 Over a year ago

can you provide additional input? How should I modify my FillText function?

Grey Chanel Over a year ago

@casao01: yeah, you can give it a try. If it solves your issue, let's mark this answer as an accepted answer.

casao01 Over a year ago

I tried the code above in my question but it still isn't working. Can you provide some help? I'm stuck and would greatly appreciate input.

Collectives™ on Stack Overflow

Simulate Pressing Enter Key to Submit (NO jquery)

1 Answer 1

4 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Linked

Related