Updated：レンジ・スライダにデータ・フォーム・データベースを表示する方法は？

-1

私はデータベースからデータを取得しようとしており、1つのデータを範囲スライダに表示する必要があります。私はPHPのforeachを使ってデータを表示しています。ただし、範囲スライダ形式でデータの1つを表示するにはどうすればよいですか？私はテーブルに範囲のスライダの値を表示する考えがありません。誰がやっているか知っていますか？Updated：レンジ・スライダにデータ・フォーム・データベースを表示する方法は？

は今、私は唯一の表示値を表示するが、スライダが値を持たない他のスライダの値の1つのテーブルのみを直面コード

<?php 
try{ 
$con = new PDO("mysql:host=localhost;dbname=gcmes", "root", ""); 
$sql = $con->query("SELECT * FROM details"); 


echo"<table class='info' align='center'>"; 
echo"<tr><td width='10'><b>No</b></td> 
<td width='30'><b>Category</b></td> 
<td width='50'><b>Job</b></td> 
<td width='40'><b>Evaluate</b></td> 
<td width='30'><b>Marks</b></td><tr>"; 
foreach($sql as $row) { 
$Item = $row["Item"]; 
$Category = $row["Category"]; 
$Job = $row["Job"]; 
$Evaluate = $row["Hole 6"]; 
echo' 
    <tr> 
     <td>' . $Item . '</td> 
     <td>' . $Category . '</td> 
     <td>' . $Job . '</td> 
     <td><div id="slidecontainer"><input type="range" min="1" max="5" value="' . $Evaluate . '" class="slider" id="myRange"> 
     </td> 
     <td><span id="demo"></span> 
     <script> 
     var slider = document.getElementById("myRange"); 
     var output = document.getElementById("demo"); 
     output.innerHTML = slider.value; 
     slider.oninput = function() { 
      output.innerHTML = this.value; 
      } 
      </script> 
      </td> 
    </tr> 
'; 

} 
echo"</table>"; 
} 
catch(PDOException $e) { echo "error".$e->getMessage(); } 
?>

を更新しました。画像は、結果

image

それのコードが間違っているのですが表示されますか？誰でも知っていますか？おかげ

出典

2017-12-11 J. Lee

$ = $行[「穴6」] DBに格納された値を返す評価しますか？ – Noel

私は2つの形式で値を求め、一方はintで、それ以外はスライダです。ユーザーが範囲を変更してクリックすると、更新ボタンがdbに格納されます。 –

各要素の正しい値を表示するには、_value = '$ Evaluate'_を書く属性値に.. [ここ]（https://www.w3schools.com/howto/howto_js_rangeslider.asp）に示すように、スライダーを実装しよう。値を更新するには、[この回答]（https://stackoverflow.com/questions/11788005/how-to-get-fetch-html5-range-sliders-value-in-php）を試してください。それが役に立ったら答えとして投稿できると教えてください。 – Noel

$Hole6が数値である場合は、デフォルトrange slider

変更に次の行を使用することができます。

echo"<tr><td>$Item</td><td>$Category</td><td>$Job</td><td>$Evaluate</td><td>$Hole6</td></tr>";

echo' 
     <tr> 
      <td>' . $Item . '</td> 
      <td>' . $Category . '</td> 
      <td>' . $Job . '</td> 
      <td>' . $Evaluate . '</td> 
      <td><input type="range" min="1" max="100" value="' . $Hole6 . '"></td> 
     </tr> 
    ';

と、第2の部分のために、 jQueryを使って簡単に行うことができます。私はあなたの例を作った：

<html> 
<head> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
</head> 
<body> 
<table> 
    <tr> 
     <td><input type="range" min="1" max="100" value="50" id="slider1"></td> 
     <td><span id="value1">50</span></td> 
    </tr> 
    <tr> 
     <td><input type="range" min="1" max="100" value="70" id="slider2"></td> 
     <td><span id="value2">70</span></td> 
    </tr> 
</table> 
<script> 
    $(document).ready(function() { 
     $('input[type=range]').on("input", function() { 
      var sid = this.id.substr(6); 
      var val = $(this).val(); 
      $("#value" + sid).text(val); 
     }); 
    }) 
</script> 
</body> 
</html>

出典

2017-12-11 10:23:07 Wouter075

ありがとう、私はすでにそれを得る。今私はスライダを変更するときに値を表示する方法に直面している？次の欄 –

編集@ J.Lee – Wouter075

を参照して、データベースの値をどのように更新する予定ですか？ – Noel

<form action="yourfile.php" method="post">

であなたの<table>をラップの最初のは、その後、あなたのスライダーにname属性を置きます。

<td><div id="slidecontainer"><input type="range" min="1" max="5" value="$Evaluate" name="slider" class="slider" id="myRange">

</form>が閉じられる前に、あなたは<input type="submit" name="submit" value="Submit"/>が必要になります。

if (isset($_POST['submit'])) //if submit is pressed { $newValueOfSlider = $_POST['slider']; //this takes the value of the slider }

が次にデータベースを更新するためにSQLクエリにあなたの変数を追加します：<?php?>インサイド

あなたがチェックする必要があります。

出典

2017-12-11 18:16:07 Noel

Updated：レンジ・スライダにデータ・フォーム・データベースを表示する方法は？

答えて

関連する問題