only degrade input types that conflict with our replacement UI control. For now, just search and range. Fixes #415, Fixes #420

This commit is contained in:
scottjehl 2010-11-10 11:22:56 -05:00
parent 3b5d12a207
commit 12b1bb4fa2
3 changed files with 35 additions and 17 deletions

View file

@ -28,11 +28,6 @@
<label for="name">Text Input:</label>
<input type="text" name="name" id="name" value="" />
</div>
<div data-role="fieldcontain">
<label for="password">Password:</label>
<input type="password" name="password" id="password" value="" />
</div>
<div data-role="fieldcontain">
<label for="textarea">Textarea:</label>

View file

@ -55,7 +55,30 @@
<label for="password">Password Input:</label>
<input type="password" name="password" id="password" value="" />
</div>
<h2>More standard HTML5 input types</h2>
<p>In jQuery Mobile, you can use new HTML5 input types such as <code>email</code>, <code>tel</code>, <code>number</code>, and more. We actively degrade certain types to <code>type=text</code> (currently, <code>range</code> and <code>search</code>) in certain cases when we provide a replacement for that type's native control. You can configure which types are degraded to text through the <code>page</code> plugin's options.</p>
<div data-role="fieldcontain">
<label for="number">Number:</label>
<input type="number" name="number" id="number" value="" />
</div>
<div data-role="fieldcontain">
<label for="email">Email:</label>
<input type="email" name="email" id="email" value="" />
</div>
<div data-role="fieldcontain">
<label for="url">Url:</label>
<input type="url" name="url" id="url" value="" />
</div>
<div data-role="fieldcontain">
<label for="tel">Tel:</label>
<input type="tel" name="tel" id="tel" value="" />
</div>
<h2>Textareas</h2>

View file

@ -11,19 +11,19 @@ jQuery.widget( "mobile.page", jQuery.mobile.widget, {
backBtnText: "Back",
addBackBtn: true,
degradeInputs: {
color: true,
date: true,
datetime: true,
"datetime-local": true,
email: true,
month: true,
number: true,
color: false,
date: false,
datetime: false,
"datetime-local": false,
email: false,
month: false,
number: false,
range: true,
search: true,
tel: true,
time: true,
url: true,
week: true
tel: false,
time: false,
url: false,
week: false
}
},