This is a migrated thread and some comments may be shown as answers.

[bug report] Slider on iOS7

11 Answers 113 Views

Slider

This is a migrated thread and some comments may be shown as answers.

11 Answers, 1 is accepted

Accepted

answered on 23 Jan 2014, 12:04 PM

<!DOCTYPE html>

<html>

<body>

<div data-role="view" id="drawer-so2" data-layout="drawer-layout" data-title="So2">

<ul data-role="listview" class="inboxlist" id="so2">

<li>

<input id="sulfitePresent" class="sulfitePresent" data-role="slider" data-min="1" data-max="100" data-value-update="change" data-bind="value: sulfitePresent" />

SO<sub>2</sub> present<span data-bind="text: sulfitePresent" class="so2present"></span><br />

</li>

<li>

<input class="sulfiteVoulu" data-role="slider" data-min="5" data-max="100" data-bind="value: sulfiteVoulu" />

SO<sub>2</sub> voulu<span data-bind="text: sulfiteVoulu" class="so2voulu"></span><br/>

</li>

<li>

<input class="volumeVin" data-role="slider" data-min="1" data-max="100" data-bind="value: volumeVin" />

Volume de vin<span data-bind="text: volumeVin" class="volume"></span><br/>

</li>

<li>

<a data-icon="info" data-role="button" href="#info" data-rel="popover">Resultat sous différente unité</a>

<span data-bind="text: resultatMl" class="ml"></span> ml de solution à 10%</br>

<span data-bind="text: resultatL" class="l"></span> l de solution à 10%</br>

<span data-bind="text: resultatGramme" class="gr"></span> g de solution en gaz</br>

</li>

</ul>

<div id="info" data-role="popover">

<div data-role="view">

<p>Les résultats sont calculés à partir de la teneur en so<sub>2</sub> libre.</p>

</div>

<div data-role="layout" data-id="drawer-layout">

<header data-role="header">

<div data-role="navbar">

<a data-role="button" data-rel="drawer" href="#my-drawer" data-icon="drawer-button" data-align="left"></a>

<span data-role="view-title"></span>

</div>

</header>

</div>

</body>

</html>

and my js:

var viewModel = kendo.observable({

sulfitePresent: 10,

sulfiteVoulu: 30,

volumeVin: 6,

resultatMl: function() {

return ((this.get("sulfiteVoulu") - this.get("sulfitePresent")) * (this.get("volumeVin") * 1.5)).toFixed(2);

},

resultatL : function(){

return ((this.get("sulfiteVoulu") - this.get("sulfitePresent")) * (this.get("volumeVin") * 1.5)/1000).toFixed(2);

},

resultatGramme: function(){

return ((this.get("sulfiteVoulu") - this.get("sulfitePresent")) * (this.get("volumeVin") * 1.5)/100).toFixed(0);

},

});

$(document).ready(function() {

kendo.bind($("li"), viewModel);

});

there is a solution to add the increase and the decrease button for mobile slider ?

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting & Mocking

Automated Testing

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Productivity and Design Tools

[bug report] Slider on iOS7

11 Answers, 1 is accepted