New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

.live() and checkbox labels #2383

Closed
benashby opened this Issue Sep 3, 2011 · 11 comments

Comments

Projects
None yet
7 participants
@benashby

benashby commented Sep 3, 2011

<label> tags do not respond to .live() bindings wether bound on page load or after injecting new objects.

It does work on a desktop, but not on mobile.

Here is the example that won't work on mobile: http://jsfiddle.net/benashby/MkxYh/

@sbounmy

This comment has been minimized.

Show comment
Hide comment
@sbounmy

sbounmy Nov 24, 2011

run into the exact same problem. Any suggestion to fix this ?

sbounmy commented Nov 24, 2011

run into the exact same problem. Any suggestion to fix this ?

@sbounmy

This comment has been minimized.

Show comment
Hide comment
@sbounmy

sbounmy Nov 24, 2011

binding the event on the input works well !

$(":radio").bind("click", function(){
 //blabla...
})

sbounmy commented Nov 24, 2011

binding the event on the input works well !

$(":radio").bind("click", function(){
 //blabla...
})
@benashby

This comment has been minimized.

Show comment
Hide comment
@benashby

benashby Nov 24, 2011

Yup, this is what I ended up doing. It's expensive and I am loath to do it, but until I come up with another solution this is what works.

benashby commented Nov 24, 2011

Yup, this is what I ended up doing. It's expensive and I am loath to do it, but until I come up with another solution this is what works.

@Andrey-I

This comment has been minimized.

Show comment
Hide comment
@Andrey-I

Andrey-I May 5, 2012

hi
not sure is this fix or not...
try to change from return "false" to "true" for the label "vclick" handler in "mobile.checkboxradio" widget.

I mean 5296 line number in jQuery Mobile Framework 1.1.0 db342b1

Andrey-I commented May 5, 2012

hi
not sure is this fix or not...
try to change from return "false" to "true" for the label "vclick" handler in "mobile.checkboxradio" widget.

I mean 5296 line number in jQuery Mobile Framework 1.1.0 db342b1

@jaspermdegroot

This comment has been minimized.

Show comment
Hide comment
@jaspermdegroot

jaspermdegroot May 8, 2012

Member

This seems to be working, without making any changes. See: http://jsbin.com/uripah/2/

You can bind to the input element (example 1) or the label (example 2). Both work.

For dynamically injected input elements (example 3) it is different though. In that case you can bind to the label, but not the input element itself. To be honest, I have no idea yet why that is.

Note that this fiddle loads an adjusted version of the JQM js file to refresf corners of controlgroup after injecting new item (this change is under review).

Member

jaspermdegroot commented May 8, 2012

This seems to be working, without making any changes. See: http://jsbin.com/uripah/2/

You can bind to the input element (example 1) or the label (example 2). Both work.

For dynamically injected input elements (example 3) it is different though. In that case you can bind to the label, but not the input element itself. To be honest, I have no idea yet why that is.

Note that this fiddle loads an adjusted version of the JQM js file to refresf corners of controlgroup after injecting new item (this change is under review).

@Andrey-I

This comment has been minimized.

Show comment
Hide comment
@Andrey-I

Andrey-I May 9, 2012

uGoMobi, thank you for your answer and useful example
All examples work at desktop browsers, but on device browser (HTC desire Z, android 2.3.3) only example 1 works properly. It may be necessary to use "vclick" instead of "click "
And in previous message I was not enough clear... I need to handle a "vclick" event.

Andrey-I commented May 9, 2012

uGoMobi, thank you for your answer and useful example
All examples work at desktop browsers, but on device browser (HTC desire Z, android 2.3.3) only example 1 works properly. It may be necessary to use "vclick" instead of "click "
And in previous message I was not enough clear... I need to handle a "vclick" event.

@jaspermdegroot

This comment has been minimized.

Show comment
Hide comment
@jaspermdegroot

jaspermdegroot May 22, 2012

Member

@gseguin @johnbender

Can one of you give this a look?
I created a JSBin to test with http://jsbin.com/ulohoj/8/

Thanks!

Member

jaspermdegroot commented May 22, 2012

@gseguin @johnbender

Can one of you give this a look?
I created a JSBin to test with http://jsbin.com/ulohoj/8/

Thanks!

@johnbender

This comment has been minimized.

Show comment
Hide comment
@johnbender

johnbender May 22, 2012

Contributor

@uGoMobi

Yah we simply don't trigger the event on the label. This should be a fairly simple fix but should be tested.

https://github.com/jquery/jquery-mobile/blob/master/js/jquery.mobile.forms.checkboxradio.js#L97

just need to trigger on the label.

Contributor

johnbender commented May 22, 2012

@uGoMobi

Yah we simply don't trigger the event on the label. This should be a fairly simple fix but should be tested.

https://github.com/jquery/jquery-mobile/blob/master/js/jquery.mobile.forms.checkboxradio.js#L97

just need to trigger on the label.

@johnbender

This comment has been minimized.

Show comment
Hide comment
@johnbender

johnbender May 22, 2012

Contributor

Update:

I'm a jackass. We need to figure out why the return false is in there. That's likely preventing the event from bubbling up to the document level where the live binding will work.

Contributor

johnbender commented May 22, 2012

Update:

I'm a jackass. We need to figure out why the return false is in there. That's likely preventing the event from bubbling up to the document level where the live binding will work.

@gabrielschulhof

This comment has been minimized.

Show comment
Hide comment
@gabrielschulhof

gabrielschulhof Nov 24, 2012

Contributor

git blame will take you down memory lane:

0a063c6 -> 6414e35 -> 38c1c24

It seems that @scottjehl moved the check/uncheck to touchend/mouseup to fix #753 (checkboxradio widget is too slow in mobile device) and that's when he introduced the return false for click. Later, @jblas replaced it with vclick, but the return false remained.

So, this is another place where we went with vclick in order to speed up responsiveness. It doesn't seem as though it's absolutely necessary to return false to that event.

Contributor

gabrielschulhof commented Nov 24, 2012

git blame will take you down memory lane:

0a063c6 -> 6414e35 -> 38c1c24

It seems that @scottjehl moved the check/uncheck to touchend/mouseup to fix #753 (checkboxradio widget is too slow in mobile device) and that's when he introduced the return false for click. Later, @jblas replaced it with vclick, but the return false remained.

So, this is another place where we went with vclick in order to speed up responsiveness. It doesn't seem as though it's absolutely necessary to return false to that event.

@arschmitz

This comment has been minimized.

Show comment
Hide comment
@arschmitz

arschmitz Nov 24, 2012

Member

@gabrielschulhof I looked into this a bit last week and came to the same conclusion but haven't had a chance to thuroughly test to make sure nice with the git blame to find the reason for its being introduced

Member

arschmitz commented Nov 24, 2012

@gabrielschulhof I looked into this a bit last week and came to the same conclusion but haven't had a chance to thuroughly test to make sure nice with the git blame to find the reason for its being introduced

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