Prevent data-role="button" from double enhancing buttons or inputs #3141

Closed
toddparker opened this Issue Nov 22, 2011 · 11 comments

Projects

None yet

7 participants

@toddparker

If you add data-role="button" to a button or input type=button/submit/etc. which is automatically enhanced, the script will add the button markup twice: wrapping the input and also injecting the button markup inside the input.

  <input data-role="button" type="submit" value="GO"/>

Even though this is incorrect markup, we should put in a check to see if there is duplication between the role and auto-init and not apply the markup enhancements twice in this scenario to make this fool-proof.

@jblas

This should be pretty easy and involve simply checking for the existence of a data object named "button" before executing the code in buttonMarkup().

@MauriceG

It seems, issue #3005 is related to this one. The duplicate button markup misses the ui-corner-styling for the last button in a controlgroup.

@redaemn

@toddparker

Sorry, can you create a test page if the problem still exist? I'm not able to recreate the bug here... :(

@toddparker

Ok, this is so odd, it seems to be working now. Looking at why:
http://jsbin.com/ukewu3/201

Lots of issues reported on this in the past:
#2875
#1000
#2379

@toddparker

So any ideas why $("#mytest").button().button('disable'); would disable the button correctly but $("#mytest").button('disable'); doesn't disable the button?

@jblas

@toddparker

"disable" is actually a method on the button widget. This is basically a constructor (create) call for the widget:

$("#mytest").button();

while this is calling disable() on an existing button:

$("#mytest").button("disable");

You can't call the last example unless you've done the first one at some time before.

@imjoshdean imjoshdean pushed a commit that referenced this issue Dec 26, 2011
Josh Dean Prevent inputs with unnecessary data-role button from being double en…
…hanced: bug #3141
79d2077
@toddparker

@jblas - Thanks, that was what I was thinking, just needed some confirmation.

@garann garann added a commit to garann/jquery-mobile that referenced this issue Jan 10, 2012
@garann garann fix for #3141 - redirect from button() and buttonMarkup() to correct …
…function for element
c0dbecc
@gseguin gseguin closed this in f0849af Jan 18, 2012
@gseguin gseguin added a commit that referenced this issue Jan 19, 2012
Josh Dean Added test for issue #3141 b1c6c4c
@gseguin gseguin added a commit that referenced this issue Jan 19, 2012
Josh Dean Added test for issue #3141 ba9d5a4
@lismore

Hi everyone, never commented on GitHub before ,

I am having this issue of the button double enhancing.

This is what I have. HTML below (GitHub does not show it)

I also tried with

I keep getting double submit buttons. Its the only thing holding me up at this stage of submitting my app to Apple.

@agcolom
jQuery Foundation member

@lismore could you try to produce a jsbin with your example? template here: http://jsbin.com/amozef/1/edit
(see details about how to report an issue: https://github.com/jquery/jquery-mobile/blob/master/CONTRIBUTING.md)

Thank you

@lismore
@agcolom
jQuery Foundation member

I'm glad you found the problem :-)
and you're very welcome....

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment