使用带有php数组的javascript滑块

Question

I'm attempting to make a range slider that will work with php. I have part of the code up but can't get the range slider to update the number. From what I can see is it is somewhere in the onchange event. I posted the sections of the code that need attention. But this is basically one big if else statement and javascript at the end. Why I did it this way I really don't know. I'm in a bit of a time crunch though. So a solution would be awesome.

       // View all products
       else {
// Display site links
echo "<p>
    <a href='./index.php'>SweetShop</a></p>";

echo "<h3>Our Products</h3>";
 echo "<form name='form1' method='post' action=''>
    <p>
        <input id='slider' type='range' min='.50' max='2.00' step='.50' value='2.00' onchange='printValue('slider','rangeValue')' />
        <input style='text-align: center' id='rangeValue' type='text' size='2' />
        </p>
    </form>";
echo "<table align='center' border='2px solid' style='width:500px;' cellspacing='0'>";
echo "<tr>
    <th style='border-bottom:1px solid #000000;'>Name</th>
    <th style='border-bottom:1px solid #000000;'>Price</th>
    <th style='border-bottom:1px solid #000000;'>Category</th>
</tr>";


// Loop to display all products
foreach($products as $id => $product) {
    echo "<tr>
        <td style='border-bottom:1px solid #000000;'><a href='./index.php?view_product=$id'>" . $product['name'] . "</a></td>
        <td style='border-bottom:1px solid #000000;'>$" . $product['price'] . "</td> 
        <td style='border-bottom:1px solid #000000;'>" . $product['category'] . "</td>

    </tr>";
}
echo "</table>";
}

    echo $footer;

?>

<script>
  function printValue(sliderID, textbox){
    var x= document.getElementById(textbox);
    var y= document.getElementById(sliderID);

    x.value = y.value;
  }

   window.onload = function () {
      printValue('slider', 'rangeValue')
   }
 </script>

Answer 1

Not sure if this counts as a solution, but I'd take a look at your onchange code:

onchange='printValue('slider','rangeValue')'

The quotation marks inside the 'onchange' attribute are not escaped. I'd suggest changing this to:

onchange="printValue('slider','rangeValue')"

Not being able to test your code, I don't know if that will fix the problem, but it should move things forwards at least!