0

Fairly new to jQuery library, I'm trying to implement the following: enter image description here

I've managed to bind the values of the control group to a variable, but I want to offer the user the possibility to enter a custom value in the spinner attached to the "Custom" checkbox.

Here are samples of the code I'm working on: (JavaScript)

$(function() { 
    /** Truncated code **/

    var intervalId, intervalDelay = 1000;
    var spinner = $( "#spinner" ).spinner();

    function handleSpeed(e) {
        intervalDelay = $(e.target).val();
    };
    $(".speed-bar").controlgroup();
    $("[name='speed']").on( "change", handleSpeed);
    $("[name='speed']").checkboxradio({
        icon: false
    })
} );

HTML:

<div class="speed-wrap">
    <div class="speed-bar">
        <label for="speed-rt">Real Time (2mn)</label>
        <input type="radio" name="speed" id="speed-rt" value=120000>
        <label for="speed-2x">x2 (1mn)</label>
        <input type="radio" name="speed" id="speed-2x" value=60000>
        <label for="speed-5x">x5 (24s)</label>
        <input type="radio" name="speed" id="speed-5x" value=24000>
        <label for="speed-60x">x60 (2s)</label>
        <input type="radio" name="speed" id="speed-60x" value=2000 checked>
        <label for="custom">Custom</label>
        <input type="radio" name="speed" id="custom">
        <input id="spinner" name="spinner">
    </div>
</div>

Side-quest: Is there an easy way to make the spinner height the same as the other buttons? spinner.height(15);

Fluffy
  • 857
  • 1
  • 9
  • 20
  • http://stackoverflow.com/questions/17922215/jquery-ui-spinner-disable-keyboard-input – Vinay Nov 29 '16 at 11:29
  • @Novice How does this help? I want the user to be able to type a custom value into the spinner – Fluffy Nov 30 '16 at 13:02
  • So can't the user just type in there? Enable typing when checkbox is checked disable otherwise – Vinay Nov 30 '16 at 15:08
  • @Novice I apologize, I probably wasn't clear enough in my question. I already can type into the spinner. The use-case is: Chose one of the values attached to the radio boxes OR click "Custom" and use the value typed in by the user (within range). I'm looking for a way to bind the spinner value to a variable when the "Custom" checkbox is checked. – Fluffy Nov 30 '16 at 15:26
  • I now have a kind-of working implementation but it doesn't look good... – Fluffy Nov 30 '16 at 15:27

0 Answers0