I have a HTML5 form as follows, which is styled with Bootstrap3 and contains a range input and a number input. The two inputs are linked so that whenever I change the range value, the number input is updated and vice versa.

What's bothering me is that when I change the number input value and hit the Enter key, the whole web page reloads and this wipes out all other data loaded into the page with JavaScript.

My questions is, how can I change the HTML/code to disable this reloading behavior?

Thanks.

    <form class=form-horizontal>

        <div class=form-group>

            <div class=col-xs-6>

                <input type=range class=policy_slider name=demandRange min=0.1 max=10 value=1 oninput=this.form.demandInput.value=this.value/>

            </div>

            <div class=col-xs-1>

                <input type=number name=demandInput min=0.1 max=10 value=1 step=any oninput=this.form.demandRange.value=this.value/>

            </div>

        </div>

    </form>