diff --git a/js/jquery.mobile.forms.button.js b/js/jquery.mobile.forms.button.js index 2afeb732..31db9786 100644 --- a/js/jquery.mobile.forms.button.js +++ b/js/jquery.mobile.forms.button.js @@ -17,36 +17,11 @@ $.widget( "mobile.button", $.mobile.widget, { }, _create: function(){ var $el = this.element, - o = this.options, - type = $el.attr('type'); - $el - .addClass('ui-btn-hidden') - .attr('tabindex','-1'); + o = this.options; //add ARIA role - this.button = $( "", { - "href": "#", - "role": "button", - "aria-label": $el.attr( "type" ) - } ) + this.button = $( "
" ) .text( $el.text() || $el.val() ) - .insertBefore( $el ) - .click(function(e){ - if(!o.disabled){ - if ( $el.attr("type") !== "reset" ){ - var $buttonPlaceholder = $("", - {type: "hidden", name: $el.attr("name"), value: $el.attr("value")}) - .insertBefore($el); - - } - $el.submit(); - $buttonPlaceholder.remove(); - } - else{ - $el.trigger("click") - } - e.preventDefault(); - }) .buttonMarkup({ theme: o.theme, icon: o.icon, @@ -55,7 +30,24 @@ $.widget( "mobile.button", $.mobile.widget, { corners: o.corners, shadow: o.shadow, iconshadow: o.iconshadow + }) + .insertBefore( $el ) + .append( $el.addClass('ui-btn-hidden') ); + + //add hidden input during submit + if( $el.attr('type') !== 'reset' ){ + $el.click(function(){ + var $buttonPlaceholder = $("", + {type: "hidden", name: $el.attr("name"), value: $el.attr("value")}) + .insertBefore($el); + + //bind to doc to remove after submit handling + $(document).submit(function(){ + $buttonPlaceholder.remove(); + }); }); + } + }, enable: function(){ diff --git a/themes/default/jquery.mobile.button.css b/themes/default/jquery.mobile.button.css index 2ae040d7..0b10abba 100644 --- a/themes/default/jquery.mobile.button.css +++ b/themes/default/jquery.mobile.button.css @@ -50,4 +50,4 @@ .ui-btn-icon-top .ui-icon { top: 5px; } .ui-btn-icon-bottom .ui-icon { bottom: 5px; } /*hiding native button,inputs */ -.ui-btn-hidden { position: absolute; left: -9999px; } +.ui-btn-hidden { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -webkit-appearance: button; opacity: 0; cursor: pointer; }