gpt4 book ai didi

javascript - 使用 AJAX 和 PHP 和 Javascript 自动填充输入文本框

转载 作者:行者123 更新时间:2023-11-30 16:40:13 24 4
gpt4 key购买 nike

我有一个选择框,其中包含使用数据库 (phpmyadmin) 中的数据生成的选项,数据库如下所示:

Columns: locationID - address - postalcode - place

在选择框之后我有一些输入字段,首先是带有一些占位符的标准。

我的想法是,如果我选择一个选项,将从数据库中生成和填充字段(contactperson 字段除外,这将保持手动)。

为此,我尝试使用 AJAX。

我已经做了这个:

test.php:

<?php
//Query the database for the results we want
$query1 = $conn->query("SELECT * FROM deliveryaddress");

//Create an array of objects for each returned row
while($locationArray[] = $query1->fetch_object());

//Remove the blank entry at end of array
array_pop($locationArray);
?>

<script>
$(document).on("change","#select-box").function(){
var id = $(this).val();
$.ajax({
url : "locationAjax.php",
data : {"id":id},
type : "POST",
dataType : "HTML",
success : function(data){
// here you can write code to asign the values to text boxes.
$(".wrapperDiv").html(data);
}
});
});
</script>

<div class="wrapperDiv">
<label for="locationLabel">Locatie</label>
<select name="locations" id="locationSelectBox" >
<option>Locatie</option>
<?php foreach ($locationArray as $option) : ?>
<option value="<?php echo $option->locationID; ?>"><?php echo $option->locationID; ?></option>
<?php endforeach; ?>
</select>

<label for="address" style="float:left;">Straat/No</label>
<input type="text" name="address" id="address" placeholder="Straatnaam en nummer" />

<label for="postalCode">Postcode</label>
<input type="text" name="postalCode" id="postalCode" placeholder="Postcode" />

<label for="place">Plaats</label>
<input type="text" name="place" id="place" placeholder="Plaats" />

<label for="contactPerson">Contact</label>
<input type="text" name="contactPerson" id="contactPerson" placeholder="Contactpersoon" />
</div>

locationAjax.php:

<?php
require_once('dbconnection.php');
$locationID = $_POST['id'];
$sql = "SELECT * FROM deliveryaddress where id = $locationID";
$result = mysqli_query($conn, $sql);
?>
<?php while ($row = mysqli_fetch_assoc($result)) { ?>
<input type="text" name="name" value="<?= $row['address'] ?>" />
<input type="text" name="name" value="<?= $row['postalcode'] ?>" />
<input type="text" name="name" value="<?= $row['place'] ?>" />
}
?>

不幸的是,它不起作用。

最佳答案

试试这个

echo json_encode(mysqli_fetch_assoc($result));

在您的脚本循环中,控制台日志数据以查看故障排除结果
将脚本更改为

$(document).on("change", "#locationSelectBox").function() {
var id = $(this).val();
$.ajax({
url : "locationAjax.php",
data : {
"id" : id
},
type : "POST",
dataType : "json",
success : function(data) {
console.log(data);
//
for (var x in data) {
$('.address').val(data.address);
$('.postalcode').val(data.postalcode);
$('.place').val(data.place);
}
}
});
});

检查控制台日志是否有错误

关于javascript - 使用 AJAX 和 PHP 和 Javascript 自动填充输入文本框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32121152/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com