Permalink
Browse files

brought back degradeInputs page option, this time as a decoupled page…

… plugin file. Fixes #2123
  • Loading branch information...
scottjehl
scottjehl committed Jul 26, 2011
1 parent 7b051e0 commit 79d3aa6f040bfc0b52f9586f7d63aabe1c57ab0e
Showing with 58 additions and 11 deletions.
  1. +1 −0 Makefile
  2. +1 −0 build.xml
  3. +1 −0 js/index.php
  4. +51 −0 js/jquery.mobile.degradeInputs.js
  5. +3 −10 js/jquery.mobile.forms.slider.js
  6. +1 −1 js/jquery.mobile.forms.textinput.js
@@ -46,6 +46,7 @@ JSFILES = js/jquery.ui.widget.js \
js/jquery.mobile.core.js \
js/jquery.mobile.navigation.js \
js/jquery.mobile.transition.js \
js/jquery.mobile.degradeInputs.js \
js/jquery.mobile.dialog.js \
js/jquery.mobile.page.sections.js \
js/jquery.mobile.collapsible.js \
@@ -30,6 +30,7 @@
js/jquery.mobile.core.js,
js/jquery.mobile.navigation.js,
js/jquery.mobile.transition.js,
js/jquery.mobile.degradeInputs.js,
js/jquery.mobile.dialog.js,
js/jquery.mobile.page.sections.js,
js/jquery.mobile.collapsible.js,
@@ -12,6 +12,7 @@
'jquery.mobile.core.js',
'jquery.mobile.navigation.js',
'jquery.mobile.transition.js',
'jquery.mobile.degradeInputs.js',
'jquery.mobile.dialog.js',
'jquery.mobile.page.sections.js',
'jquery.mobile.collapsible.js',
@@ -0,0 +1,51 @@
/*
* jQuery Mobile Framework : "fieldcontain" plugin - simple class additions to make form row separators

This comment has been minimized.

@staabm

staabm Jul 26, 2011

Contributor

Typo,..? Fieldplugin,..

This comment has been minimized.

@scottjehl

scottjehl Jul 26, 2011

Contributor

ah, yes thanks. I'll get that

* Copyright (c) jQuery Project
* Dual licensed under the MIT or GPL Version 2 licenses.
* http://jquery.org/license
*/

(function( $, undefined ) {

$.mobile.page.prototype.options.degradeInputs = {
color: false,
date: false,
datetime: false,
"datetime-local": false,
email: false,
month: false,
number: false,
range: "number",
search: true,
tel: false,
time: false,
url: false,
week: false
};

$.mobile.page.prototype.options.keepNative = ":jqmData(role='none'), :jqmData(role='nojs')";


//auto self-init widgets
$( document ).bind( "pagecreate enhance", function( e ){

var page = $( e.target ).data( "page" ),
o = page.options;

// degrade inputs to avoid poorly implemented native functionality
$( e.target ).find( "input" ).not( o.keepNative ).each(function() {
var $this = $( this ),
type = this.getAttribute( "type" ),
optType = o.degradeInputs[ type ] || "text";

if ( o.degradeInputs[ type ] ) {
$this.replaceWith(
$( "<div>" ).html( $this.clone() ).html()
.replace( /\s+type=["']?\w+['"]?/, " type=\"" + optType + "\" data-" + $.mobile.ns + "type=\"" + type + "\" " )
);
}
});

});

})( jQuery );
@@ -10,17 +10,10 @@
//auto self-init widgets
$( document ).bind( "pagecreate create", function( e ){

var nativeSel = ":jqmData(role='none'), :jqmData(role='nojs')";

//degrade range back to number type
$( "input[type='range']:not("+ nativeSel +")", e.target ).each(function(){
$(this).replaceWith(
$( "<div>" ).html( $(this).clone() ).html()
.replace( /\s+type=["']?\w+['"]?/, " type=\"number\" data-" + $.mobile.ns + "role=\"slider\" " ) );
});

//now self-init
$( ":jqmData(role='slider'):not("+ nativeSel +")", e.target ).slider();
$( "input[type='range'], :jqmData(type='range'), :jqmData(role='slider')", e.target )
.not( ":jqmData(role='none'), :jqmData(role='nojs')" )
.slider();

});

@@ -9,7 +9,7 @@

//auto self-init widgets
$( document ).bind( "pagecreate create", function( e ){
$( "input[type='text'], input[type='search'], input[type='number'], input[type='password'], input[type='email'], input[type='url'], input[type='tel'], textarea", e.target )
$( "input[type='text'], input[type='search'], :jqmData(type='search'), input[type='number'], :jqmData(type='number'), input[type='password'], input[type='email'], input[type='url'], input[type='tel'], textarea", e.target )
.not( ":jqmData(role='none'), :jqmData(role='nojs')" )
.textinput();
});

1 comment on commit 79d3aa6

@OwenBrotherwood

This comment has been minimized.

Copy link

OwenBrotherwood commented on 79d3aa6 Aug 12, 2011

By the way, the doc @ http://jquerymobile.com/test/docs/forms/plugin-eventsmethods.html indicates that the type=search will be degraded to type=text: but the type get's degraded to type=true. The degrade to type=true is not something new: has been so for a long time ...

Degraded Form Input Types
jQuery Mobile degrades several HTML5 input types back to type=text, or type=number after adding enhanced controls. For example, inputs with a type of range are enhanced with a custom slider control, and their type is set to number to offer a usable form input alongside that slider. Inputs with a type of search are degraded back to type=text after we add our own themable search input styling.

Please sign in to comment.