javascript form error

Question

I have my HTML structure in the following format

<div>
<form class="form-inline" style="padding-top:10px" action="javascript:function()">   <!-- a search bar-->
  <input id="id" type="text" " placeholder="Something">
   </form>

<button onClick="somefunction()"> b</button>
</div>

the problem is I want the search bar to work when I press enter in it but unfortunately it is submitting the button element , I am slightly confused as the button is not a form element and I have specifically defined onClick. I am new to javascript so I am sure it is something small but I have not been able to solve it.

ie when I press enter , the "somefunction()" gets active as opposed to "function()"

There is also a rouge " inbetween type="text" " placeholder="Something" in the unclosed input tag — Mike Sav, Aug 14 '12 at 21:47

score 0 · Answer 1 · edited May 23 '17 at 12:27

You may put your button inside the form and have the function called in onClick return false, as discussed here.

EDIT

According to your edit and your comments on what you want, you may do the following:

<html>
<head>
    <script>
        function formfunction(){
            alert("form function is called.");
        }
        function somefunction(){
            alert("the button is clicked.");
        }
    </script>
</head>
<body>
<div>
<form name="myform" action="#" onsubmit="formfunction(); return false;">
    <input id="id" type="text" placeholder="Something">
</form>
<button type="button" onClick="somefunction()"> b</button>
</form>
</div>
</body>
</html>

I didn't get what you wanted. I've edited my answer, see if it solves your problem. — Kamyar Infinity, Aug 15 '12 at 01:17

score 0 · Answer 2 · answered Aug 14 '12 at 21:50

0

Try this

HTML

<div>
    <form class="form-inline" style="padding-top:10px" action="someFile.php" onsubmit="return someFunc();"> 
        <input id="id" type="text" placeholder="Something">
        <input type="submit" name="btn_submit" value="Submit" /> 
    </form>
</div>

JS

function someFunc(){
    // code goes here
    return false;
}

Just an example.

answered Aug 14 '12 at 21:50

The Alpha

143,660
29
287
307

Thank you , but the button condition just popped up again ! Did not work – alex Aug 14 '12 at 22:08
Well, I think you want to execute `sumeFunc` on button press and this answer is all about that. Did you check the example ? – The Alpha Aug 14 '12 at 22:12
I did , but maybe I am still a little confused , on the button click I want another function to be executed and on return I want the function linked with the form element to be executed – alex Aug 14 '12 at 22:24

javascript form error

2 Answers2