How to disable <input> submit but not typing

Question

So, I've got this <input> that I want to be able to enter stuff in, but not submit, because I already have a button that will be submitting it to a form handler.

    <form name="form">
    <input id="JSinp" type="email" name="Com" method="post"
    autocomplete="off" required autofocus>                                                                                   
    </form>
    <button onclick="exec()" id="evalbutton">Submit</button>

    <script>
    function exec() {
    var Com = document.forms["form"] ["Com"].value;
    eval(Com);
    }

The id's are solely for styling purposes. Currently, when I press enter on the <input> it shows up in the URL and goes through the whole posting refresh and whatever. That's another thing. When using method="post" isn't it not supposed to show up in the URL bar? This might just be a bug in my browser but any help would be appreciated.

UPDATE: I just replaced the button with this: <input type="submit" onclick="exec()" id="evalbutton" value="Submit">
and that works.

But any help with the method="post" would be a big help.

why do you have to use method="post" and submit="exec()" on the input ? — SnakeFoot
– SnakeFoot, Commented Mar 30, 2016 at 7:06
@SnakeFoot submit="exec()" was a mistake, sorry about that. The reason I want to use method="post" is because it looks neater :) . Sorry but that's just what I want to do. — user6120108
– user6120108, Commented Mar 30, 2016 at 7:09

JF-Mechs · Accepted Answer · 2016-03-30 07:18:34Z

1

You could prevent that event from happening by skipping the enter key.

document.getElementById('JSinp').addEventListener('keydown', function(event){
  var KEYCODE_ENTER = 13;
  if (event.which == KEYCODE_ENTER)
    event.preventDefault();
});

answered Mar 30, 2016 at 7:18

JF-Mechs

1,07110 silver badges25 bronze badges

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

Comments

Pimmol · Accepted Answer · 2016-03-30 07:12:11Z

0

First a few tips:

the method="post" belongs on the form tag
the onsubmit="exec()" belongs on the form tag as well
Never, never use eval

second, if you to prevent the form to submit when someone presses enter (which submits the form by default), listen for a keydown. And if it's enter, prevent the form to submit.

https://jsfiddle.net/ue3knhLz/2/

answered Mar 30, 2016 at 7:12

Pimmol

1,8911 gold badge10 silver badges14 bronze badges

Collectives™ on Stack Overflow

How to disable <input> submit but not typing

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related