在下拉选择后填充内部 html 代码



我有一个选择:

<form class="form-horizontal" method="post" >
<div class="form-group">
<label class="control-label col-sm-2">Oyunçu seçin</label>
<div class="col-sm-10">
<?php $players = select("`id`,`name`","`players`","`id`","ASC")->fetchAll(PDO::FETCH_ASSOC); ?>
<select id="player" name="player" class="form-control">
<option value="0">--Oyunçu seçin--</option>
<?
foreach ($players as $player) {
echo '<option value="'.$player['id'].'">'.$player['name'].'</option>';
}
?>
</select>
<div id="divFileInput"></div>
</div>
</div>
</form>

在此选择中选择项目后,将显示新的文本框:

$(function(){
$('#player').change(function(){
var selections = $("#player :selected");
var html = '';
$.each(selections,function(i,item){
html += ':<div class="form-group"><label class="control-label col-sm-2">Ad</label>' +
'<div class="col-sm-10">' +
'<input type="text" id="name" name="name" class="form-control"  value="<?= $playerfetch['name'];?>" readonly>' +
'</div></div><div class="form-group">' +
'<label class="control-label col-sm-2">Kod</label>' +
'<div class="col-sm-10">' +
'<input type="text" id="code" name="code" class="form-control" readonly>' +
'</div></div>'+
'<div class="form-group"><label class="control-label col-sm-2">Doğum tarixi</label>' +
'<div class="col-sm-10">' +
'<input type="text" id="birthday" name="birthday" class="form-control" readonly>' +
'</div></div><div class="form-group">' +
'<label class="control-label col-sm-2">Cins</label>' +
'<div class="col-sm-10">' +
'<input type="text" id="gender" name="gender" class="form-control" readonly>' +
'</div></div>' +
'<div class="form-group"><label class="control-label col-sm-2">Məşqçi</label>' +
'<div class="col-sm-10">' +
'<input type="text" id="trainer" name="trainer" class="form-control" readonly>' +
'</div></div><div class="form-group">' +
'<label class="control-label col-sm-2">Çəki</label>' +
'<div class="col-sm-10">' +
'<input type="text" id="weight" name="weight" class="form-control" readonly>' +
'</div>' +
'<div class="form-group">' +
'<div class="col-sm-offset-2 col-sm-10">'+
'<input type="submit" value="Əlavə et">'+
'</div>'+
'</div>'+
'</div>';
})
$('#divFileInput').html(html);
})

现在我想用数据库中的值填充这些文本框,但我遇到了问题。我意识到我需要使用 AJAX,因为 PHP 是一种服务器端语言。 我以前从未使用过 AJAX,我可以通过一些修改将 js 脚本转换为 ajax 还是需要再次编码,它应该是什么样子?

您已经在使用 JQuery,因此不需要任何修改。看起来您需要将数据从数据库获取到脚本中。您可以查看W3SCHOOLS示例,但将数据库数据提取到脚本中并不安全。如果您将 JQuery 与 PHP 一起使用,则应使用 PHP 来实现这些目的。希望您的问题得到解答...

最新更新