locked
LightSwitch 2013 - Problem with creating a slider RRS feed

  • Question

  • Hello,

    I'm building a LightSwitch 2013 HTML application.

    I have a property in my screen that i drag into the screen's designer and changing it to a custom control.

    In it's render code, i write the following:

    $(element).append("<input type='range' name='slider' id='slider_test' value='60' min='0' max='100' step='1' />");

    what it does is it creates an input field, but with type="number" and not "range" and it looks like a regular input field...

    Help please.

    Thanks.


    • Edited by Yaron Y Monday, November 7, 2016 6:46 AM
    Monday, November 7, 2016 6:45 AM

All replies

  • First, create a function to call:

    function createSlider1(element, contentItem, min, max) {
        // Generate the input element.
        
        $(element).append('<input type="range" min="' + min +
            '" max="' + max + '" value="' + contentItem.value + '" />');
    
    
        // Now, after jQueryMobile has had a chance to process the 
        //     new DOM addition, perform our own post-processing:
       $(element).one('slideinit', function () {
            var $slider = $('input', $(element));
    
            // If the content item changes (perhaps due to another control being
            //     bound to the same content item, or if a change occurs programmatically), 
            //     update the visual representation of the slider:
            contentItem.dataBind('value', function (newValue) {
                $slider.val(newValue);
    
    
    
            });
    
            // Conversely, whenever the user adjusts the slider visually,
            //     update the underlying content item:
    
    
            $slider.change(function () {
                contentItem.value = $slider.val();
    
            });
       });
    };


    Now call the function from the input control render method

    createSlider1(element, contentItem, 0, 3);

    Good luck

    Sven


    Sven Elm

    Tuesday, November 8, 2016 6:27 AM