Slider with dynamic value issue
Hello,
I'd like to create a slider with dynamic value. How do I refresh UI to show selected value?
My example:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.css" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.js"></script>
</head>
<body>
<script type="text/javascript">
var interval = 15; // e.g. from cookie
$("<div>").attr({ "data-role": "page", "id": "editSettings" })
.append($("<div>").attr({ "data-role": "content" })
.append($("<div>").attr({ "data-role": "fieldcontain" })
.append($("<label>").attr({ "for": "interval" }).text("Next/Previous interval (5-60):"))
.append($("<input>").attr({ "type": "range", "name": "interval", "id": "interval", "value": interval, "min": 5, "max": 60 }))
)
).appendTo("body");
</script>
</body>
</html>