0
まず、趣味として、Web開発の基本を学び始めたばかりです：html、css、javascript、php。 複数の選択ボックス条件を持つAjaxリクエスト
は、私はデータベースクエリを使用してWebページを実装しようとしていると、いくつかのdificultiesが発生している：誰かがそれをはるかに高く評価されるだろう続行するためにどの道に私を啓発することができれば。
あなたは私のためにコード全体を書くのではなく、はい、いくつかのヒントと手掛かりを示してください。
Id、items、price1、price2、price3のテーブルがあります。
多くの検索の後、私は選択リスト上のすべてのアイテムを動的にロードし、ajax呼び出しで選択したアイテムに基づいて、変更時イベントでdivに（price1）を表示しました。
この値段は、3つの値（a、b、c）と（yesまたはno）の2つの選択リストに基づいて更新する必要があります。
選択リスト2が（a）であり、選択リスト3が（yes）の場合、表示される価格は（price2）です。選択リスト2が（b）であり、リスト3が選択されている場合（yes）、表示される価格は（price3）であり、リスト3オプションが選択されている場合（no）すべてがAJAXで、選択の順序に関係なく。
私は自分自身を明確にしました。 必要に応じてコードを読み込むことができます。
ありがとうございます。 バスコ
これは私がこれまで持っているものです。
Ajax.php
<?php
db connection variables
if(!isset($_GET['id'])){
echo json_encode(array('success' => false, 'price_1' => '', 'message' => 'no id given'));
exit;
}
try {
$conn = new PDO("mysql:host=$servername;dbname=test", $username, $password);
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
} catch (PDOException $e) {
trigger_error("Connection failed: " . $e->getMessage());
echo json_encode(array('success' => false, 'price_1' => '', 'message' => 'shit happened' . $e->getMessage()));
exit;
}
$stmt = $conn->prepare("SELECT price_1 FROM table WHERE id = ?");
$stmt->execute(array($_GET['id']));
$result = $stmt->fetch(PDO::FETCH_ASSOC);
if($result === false){
trigger_error('Query failed: ' . $conn->errorInfo());
echo json_encode(array('success' => false, 'price_1' => '', 'message' => 'shit happened'));
exit;
} else {
echo json_encode(array('success' => true, 'price_1' => $result['price_1'], 'message' => ''));
exit;
}
のindex.php
<?php
Connection Variables
try {
$conn = new PDO("mysql:host=$servername;dbname=test;charset=UTF8", $username, $password);
$conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
} catch (PDOException $e) {
trigger_error("Connection failed: " . $e->getMessage());
}
$query = "SELECT `id`, `items`, `price_1` FROM `table`";
$rows = $conn->query($query)->fetchAll(PDO::FETCH_ASSOC);
?>
<!DOCTYPE html>
<html>
<head>
<script>
function getPrice(id){
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState === 4 && xmlhttp.status === 200) {
var jsonObj = JSON.parse(xmlhttp.responseText);
if(jsonObj.success === true){
document.getElementById("price_1").value = jsonObj.price_1;
}else{
document.getElementById("price_1").innerHTML = jsonObj.message;
}
}
};
xmlhttp.open("GET", "ajax.php?id=" + id, true);
xmlhttp.send();
}
</script>
</head>
<body>
<div>
<h3>GET A QUOTE</h3>
Item:
<br>
<select name="price" id="priceSelect" onchange="getPrice(this.value)">
<option>Please select:</option>
<?php foreach ($rows as $row): ?>
<option value="<?= $row['id'] ?>"><?= $row['items'] ?></option>
<?php endforeach; ?>
</select>
<br>
size:
<br>
<select name="price" id="sizeselectSelect" onchange="sizePrice(this.value)">
<option>Please select:</option>
<option value="1">size1</option>
<option value="2">size2</option>
<option value="3">size3</option>
</select>
<br>
double:
<br>
<select name="bouble" id="doubleprice" onchange="lastprice(this.value)">
<option>Please select:</option>
<option value="yes">Yes</option>
<option value="no">No</option>
</select>
<br>
<br>
Total price:
<input type="text" name="price_1[]" value="" id="price_1">€
<p id="error"></p>
</body>
</html>
コードスニペットを使ってこれまでに行ったことを、今のところ理解できないように達成しようとしていることを理解しやすくすることができたら、 – kabirbaidhya