Hopiu/jquery-mobile
1
0
Fork 0
mirror of https://github.com/Hopiu/jquery-mobile.git synced 2026-03-17 06:20:26 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Added state class to label of checkbox/radio

Browse source
This commit is contained in:
Ghislain Seguin 2011-06-23 16:57:32 -07:00 committed by scottjehl
parent 3ab9665ddd
commit 9c3ebe07ea
2 changed files with 8 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
js/jquery.mobile.forms.checkboxradio.js
View file

@ -16,6 +16,8 @@ $.widget( "mobile.checkboxradio", $.mobile.widget, {
//filter works though.
label = input.closest("form,fieldset,:jqmData(role='page')").find("label").filter('[for="' + input[0].id + '"]'),
inputtype = input.attr( "type" ),
checkedClass = "ui-"+ inputtype + "-on",
uncheckedClass = "ui-"+ inputtype + "-off",
checkedicon = "ui-icon-" + inputtype + "-on",
uncheckedicon = "ui-icon-" + inputtype + "-off";
@ -25,6 +27,8 @@ $.widget( "mobile.checkboxradio", $.mobile.widget, {
$.extend( this,{
label : label,
inputtype : inputtype,
checkedClass : checkedClass,
uncheckedClass : uncheckedClass,
checkedicon : checkedicon,
uncheckedicon : uncheckedicon
});
@ -133,9 +137,11 @@ $.widget( "mobile.checkboxradio", $.mobile.widget, {
// input[0].checked expando doesn't always report the proper value
// for checked='checked'
if ( $(input[0]).prop('checked') ) {
label.addClass( this.checkedClass ).removeClass( this.uncheckedClass );
icon.addClass( this.checkedicon ).removeClass( this.uncheckedicon );
} else {
label.removeClass( this.checkedClass ).addClass( this.uncheckedClass );
icon.removeClass( this.checkedicon ).addClass( this.uncheckedicon );
}

4
themes/default/jquery.mobile.theme.css
View file

@ -828,8 +828,8 @@ a.ui-link-inherit {
.ui-icon-radio-off {
background-color: transparent;
}
.ui-icon-checkbox-on,
.ui-icon-radio-on {
.ui-checkbox-on .ui-icon,
.ui-radio-on .ui-icon {
background-color: #4596ce; /* NOTE: this hex should match the active state color. It's repeated here for cascade */
}
.ui-icon-searchfield {