Search code examples
javascriptjqueryjquery-uiuisliderjquery-ui-slider

write jquery ui slider value to database


I would like to send the value of the jquery slider to the database. I know this question already has a lot of answers but none of them helped me.

HTML

<label for="input-sale6">price</label>
<input type="text" id="input-sale6" name="dog_price" readonly />
<div id="slider"></div>

Jquery

$("#slider").slider({
        range: "min",
        value: 100,
        min: 0,
        max: 2000,
        step: 50,
        slide: function(event, ui) {
            $("#input-sale6").val("€" + ui.value);
        },
        change: function(event, ui) { 
            $("#input-sale6").val("€" + ui.value); 
        } 
    });
    $("#input-sale6").val("€" + $("#slider").slider("value"));

Fiddle: https://jsfiddle.net/99x50s2s/106/

The php part works fine ($_POST[dog_price]). I just need to get the value.
I would be very thankful for any kind of help!


Solution

  • I think you just need to change the way you are accessing the slider value

    $("#input-sale6").val("€" +$( "#slider" ).slider( "option", "value" ));
    

    Thanks Joshua K

    Now try this:

    $("#slider").slider({
        range: "min",
        value: 100,
        min: 0,
        max: 2000,
        step: 50,
        slide: function(event, ui) {
            $("#input-sale6").val("€" + $("#slider").slider("option", "value"));
        },
        change: function(event, ui) { 
           $("#input-sale6").val("€" + $("#slider").slider("option", "value"));
        } 
    });
    $("#input-sale6").val("€" + $("#slider").slider("option", "value"));
    

    it just worked for me here