获取滑块值到PHP

Question

I am trying to make an imagecompression tool in which I would like to define the compression rate with a slider. The value of the slider is an input for the php-function imagejpeg and this is where I am stuck...

I can't get the slider value into php...

I am working with a HTML slider that I have created as followed:

<form action="" method="POST">
    <input type="range" min="0" max="100" value="100" step="1" id="compressSlider" name="ratiovalue"  oninput="ratioCalculate(value)" style="width:400px;">
    <span id="volume">100</span>
</form>

And this is my Javascript and PHP -code:

<script>        
        function ratioCalculate(slider) {
            var slideval = document.getElementById("volume");
            var filesizekb = document.getElementById("Filesizekb");
            var filesizepro = document.getElementById("Filesizepro");

            <?php

                $compressed_image = new handledImage();
                $temp_image = imagecreatefromjpeg($_SESSION['targetfile']);

                if(isset($_POST['compressSlider'])) {  
                    imagejpeg($temp_image, 'uploads/compressedSliderImage.jpg', $_POST['compressSlider']);
                    $compressed_image->name = 'compressedSliderImage';
                    $compressed_image->type = 'jpg';
                    $compressed_image->size = filesize('uploads/compressedSliderImage.jpg');
                    $compressed_image->ratio = $_POST['compressSlider'];

                    $images[5] = $compressed_image;
               } 
               else {
                   $compressed_image->ratio = -1;
               }
            ?>

            slideval.innerHTML = slider;
            document.getElementById('compressed_shown').src = 'uploads/compressedSliderImage.jpg';
            filesizekb.innerHTML = 'Filesize (kB): '+<?php // echo convert_unit($images[5]->size); ?>;
            filesizepro.innerHTML = 'Filesize (%): '+<?php // echo calculate_percentage($images[5]->size, $images[0]->size); ?>;
        }

    </script>

Slider is the value of the slider in Javascript. The Javascript variable changes when I use my slider, but the php varaible ($_POST['compressSlider']) doesn't...

Answer 1

Where is the submit button? You cannot update serverside synchronously with client side. When do you reload the page and send the POST data? I mean the data in the javascript function is set when loading the page. Maybe an update button or apply? And reload the page using $_POST?

And the name is wrong..

<input type="range" min="0" max="100" value="100" step="1" id="compressSlider" name="ratiovalue"  oninput="ratioCalculate(value)" style="width:400px;">

should be

<input type="range" min="0" max="100" value="100" step="1" id="compressSlider" name="compressSlider"  oninput="ratioCalculate(value)" style="width:400px;">