2

フォームでjQuery スライダー範囲を使用するのが困難です。テストするために、単純なフォームとプロセッサを使用します (元はhereから):

フォーム.php

<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>jQuery UI Slider - Range slider</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css" />
  <script>
  $(function() {
    $( "#slider-range" ).slider({
      range: true,
      min: 0,
      max: 500,
      values: [ 75, 300 ],
      slide: function( event, ui ) {
        $( "#amount" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] );
      }
    });
    $( "#amount" ).val( "$" + $( "#slider-range" ).slider( "values", 0 ) +
      " - $" + $( "#slider-range" ).slider( "values", 1 ) );
  });
  </script>
</head>

<body>

<form action="welcome.php" method="post">
Name: <input type="text" name="name"><br>
E-mail: <input type="text" name="email"><br>
<label for="amount">Age range:</label>
  <input type="text" id="amount" name="agerange" style="border: 0; color: #f6931f; font-weight: bold; " />
</p>
 <div id="slider-range""></div>

<input type="submit">
</form>

</body>
</html>

ようこそ.php

<html>
<body>

Welcome <?php echo $_POST["name"]; ?><br>
Your email address is: <?php echo $_POST["email"]; ?>
Your age range is: <?php echo $_POST["agerange"]; ?>
</body>
</html>

スライダーは正しく表示されますが、フォームは年齢範囲の値を返しません。このフォームが返す値がわからないため、フォーム処理スクリプトで使用できます。あなたのヒントに感謝します

4

2 に答える 2

1

年齢を扱っているため、範囲値からドル記号を削除する必要があります。この行を置き換えます：

$( "#amount" ).val( "$" + ui.values[ 0 ] + " - $" + ui.values[ 1 ] );

これとともに：

$( "#amount" ).val( ui.values[ 0 ] + " - " + ui.values[ 1 ] );

そしてこの2行：

$( "#amount" ).val( "$" + $( "#slider-range" ).slider( "values", 0 ) +
  " - $" + $( "#slider-range" ).slider( "values", 1 ) );

この2つで：

$( "#amount" ).val( $( "#slider-range" ).slider( "values", 0 ) +
  " - " + $( "#slider-range" ).slider( "values", 1 ) );

これで、$_POST["agerange"] に次の文字列ができました (たとえば): "35+-+75" ("+" は、投稿が送信されるときに php で使用されるスペースの代わりです)

次のように、explode()関数を使用して 2 つの値の配列を取得できます。

<?php
$range = explode(' - ', $_POST['agerange']);
?>
 <html>
 <body>
 Welcome <?php echo $_POST["name"]; ?><br>
 Your email address is: <?php echo $_POST["email"]; ?>
 Minimum age in your range is: <?php echo $range[0]; ?><br />
 ....and maximum is: <?php echo $range[1]; ?><br />
 </body>
 </html>
于 2013-11-01T17:13:45.937 に答える