Menu icon Foundation
input type submit doesn't act like a button

Trying to use the .button or button-group or split-button styles with an input type of submit doesn't act correctly.

here's a picture of 2 inputs to submit a login form.

Screen shot 2014 01 17 at 10.50.45 am

inputbuttoncss

Trying to use the .button or button-group or split-button styles with an input type of submit doesn't act correctly.

here's a picture of 2 inputs to submit a login form.

Screen shot 2014 01 17 at 10.50.45 am
prekocrado almost 2 years ago

I was also running a similar problem. I manage to solve it following the guide on how to create a button as link.

 

Hope it helps!

Zack over 5 years ago

Yeah, I'm running into a similar problem. Best solution I can think of is to make your submit button an anchor tag and run some jquery on click for that to submit the form. Something like this: (UNTESTED)
HTML
<a id="login_button" href="#" class="button split">Log in <span data-dropdown="drop">as</span></a>
<ul>
(dropdown stuff here)
</ul>

And then:

 $('#login_button').click(function(){
    $('#my_form').submit() //more details here if you need
});

You could even use jQuery to iterate over all the list items to do that same...either give them a "data-url" attirbute and use that for the url they send to or a "data-login-as" data for more post data to send

Hope that helps! I decided to just use two separate buttons for mine, but I would've done it this way if I had more things in my dropdown.

Good luck!
-Z