depending on which radio button is pressed, I want to set the max value of a slider dynamically.

It seems, that:

- when I click a radio button, setSlider is called twice

- the max value does not change at all

1. Here's the code:
2. 
   
3. $(document).ready(function() {
4. $("input[name='Periode']").click(function() {
5. setSlider($("input[name=Periode]:radio:checked").attr("value"));
6. })
7. });
8. 
   
9. function setSlider(id) {
10. var intHours = new Array(24, 24 * 365/12, 24 * 365/4, 24 * 365);
11. alert(id);
12. $('#page').page();
13. $('#slider-hour').max(intHours[id]);
14. $('#slider-hour').slider('refresh');
15. 
    
16. }
17. 
    
18. function radioWert(rObj) {
19. for (var i=0; i<rObj.length; i++) if (rObj[i].checked) return rObj[i].value;
20. return false;
21.  }
22. 
    
23. [..]
24. 
    
25. <form name="Bezugsperiode" action="">
26. <fieldset data-role="controlgroup" data-type="horizontal">
27. <input type="radio" name="Periode" id="tag"    value="0" checked>
28. <label for="tag">Tag</label>
29. <input type="radio" name="Periode" id="monat"   value="1">
30. <label for="monat">Monat</label>
31. <input type="radio" name="Periode" id="quartal" value="2">
32. <label for="quartal">Quartal</label>
33. <input type="radio" name="Periode" id="jahr"    value="3">
34. <label for="jahr">Jahr</label>
35. </fieldset>
36. 
    
37. <label for="slider-hour">Input slider</label>
38. <input type="range" name="slider-hour" id="slider-hour" value="0" min="0" max="24"  data-highlight="true" />