Adding a button to form - html

Question

<form class="user" method="POST" action="{{ url('login') }}?next={{next_url}}">
{{ csrf_token()|raw }}
<div class="form-group">
<input type="email" name="email" required="required" id="email" aria-describedby="emailHelp" placeholder="{{ _('Enter Email Address...') }}">
</div>
<div class="form-group">
<input type="password" name="password" required="required" autocomplete="false" id="password" placeholder="{{ _('Password') }}">
</div>
<button type="submit">
{{_("Login")}}
</button>
</form>
I need to add a button for register (example.com/register) below the login button. But when I add that when the user clicks on the Register button, It says that Email and password fields are required. How to resolve this issue?
Register button code: <button href="{{ url('register') }}">{{_("Create an Account!")}}</button>

Answer 1

The HTML button tag can be of 3 types: submit, reset and button. If you do not specify the type it will default to submit. If the button then happens to be inside a form, it will try to submit it, hence the error you are getting.
There are a couple options you have here:
Specify the type of the button:
<button type="button" href="{{url('register')}}">{{_("Create an Account!")}}</button>
Put the button outside the form:
<form>
</form>
<button ....>
Use e.preventDefault() in javascript if you have an onclick method for the button:
function buttonClick(e) {
e.preventDefault(); // this will prevent the default behavior of a submit
// button which is to submit a form
// ...
}

Answer 2

Set type to button instead of submit (default value).
<button type="button">Register</button>

Answer 3

Just do a seperate Form
<form action="{{ url('register') }}"
<button type="submit">Create an Account!</button>
</form>

Answer 4

Another Solution if you are using MVC.
You can create the button in your Function register (Controller) then just call it to form
Controller: <div class=\"col-lg-5 col-xs-5\"> <button type='button' class='btn btn-success btn-block' id='register' > Create Account </button> </div>
$data['btn']=$btn;
View:
<form>
<?=#$btn ?>
</form>
Or just do other form
<form>
<button type='button' class='btn btn-success btn-block' id='register'> Create Account</button>
</form>