如何将数据库中的数据显示到选项标签 html 中?
how to display data from database into an option tag html?
有人可以帮我解决这个问题吗?
我想将我的数据库数据显示到一个选项标签中,但它没有显示任何内容。我已经尝试为此编写代码,但该代码无法将我的数据显示到 html 选项标签中。有人请帮我解决我的问题。
这是我编写的代码
// JavaScript Document
// for make the option tag
$(function() {
$('#chkveg').multiselect({
includeSelectAllOption: true
});
});
// for call the data from my database
$(document).on('click','#nama_check',function(e){
$.ajax({
type:"POST",
url:"../php/absen/absen_karyawan_autocomplete.php",
success: function(data){
var list = JSON.parse(data);
for(var i=0; i < list.length; i++){
$('#chkveg').val((list[i]['bagian']));
}
return false;
}
});
});
<script src="https://davidstutz.github.io/bootstrap-multiselect/docs/js/bootstrap-3.3.2.min.js"></script>
<link href="https://davidstutz.github.io/bootstrap-multiselect/docs/css/bootstrap-3.3.2.min.css" rel="stylesheet"/>
<link href="https://davidstutz.github.io/bootstrap-multiselect/dist/css/bootstrap-multiselect.css" rel="stylesheet"/>
<script src="https://davidstutz.github.io/bootstrap-multiselect/dist/js/bootstrap-multiselect.js"></script>
<form id="form1" method="post">
<div style="padding:20px">
<select id="chkveg" multiple="multiple">
</select>
</div>
</form>
这里有两个问题。首先要向 select
添加值,您需要向其添加新的 option
元素,而不是重复设置 val()
。其次,您应该在添加选项后调用 multiselect()
。
另请注意,您可以将所有代码放在一个 document.ready 处理程序中。试试这个:
$(function() {
$(document).on('click','#nama_check',function(e){
$.ajax({
type: "POST",
url: "../php/absen/absen_karyawan_autocomplete.php",
dataType: 'json',
success: function(data) {
var html = '';
for(var i = 0; i < data.length; i++) {
html += '<option>' + data[i]['bagian'] + '</option>';
}
$('#chkveg').html(html).multiselect({
includeSelectAllOption: true
});
}
});
});
});
使用.append()。
尝试查看此文档:http://api.jquery.com/append/
dataType: 'json',
success: function(data){
var list = JSON.parse(data);
for(var i=0; i < list.length; i++){
$('#chkveg').append($('<option>'+ list[i]['bagian'] +'</option>'));
}
return false;
}
有人可以帮我解决这个问题吗? 我想将我的数据库数据显示到一个选项标签中,但它没有显示任何内容。我已经尝试为此编写代码,但该代码无法将我的数据显示到 html 选项标签中。有人请帮我解决我的问题。
这是我编写的代码
// JavaScript Document
// for make the option tag
$(function() {
$('#chkveg').multiselect({
includeSelectAllOption: true
});
});
// for call the data from my database
$(document).on('click','#nama_check',function(e){
$.ajax({
type:"POST",
url:"../php/absen/absen_karyawan_autocomplete.php",
success: function(data){
var list = JSON.parse(data);
for(var i=0; i < list.length; i++){
$('#chkveg').val((list[i]['bagian']));
}
return false;
}
});
});
<script src="https://davidstutz.github.io/bootstrap-multiselect/docs/js/bootstrap-3.3.2.min.js"></script>
<link href="https://davidstutz.github.io/bootstrap-multiselect/docs/css/bootstrap-3.3.2.min.css" rel="stylesheet"/>
<link href="https://davidstutz.github.io/bootstrap-multiselect/dist/css/bootstrap-multiselect.css" rel="stylesheet"/>
<script src="https://davidstutz.github.io/bootstrap-multiselect/dist/js/bootstrap-multiselect.js"></script>
<form id="form1" method="post">
<div style="padding:20px">
<select id="chkveg" multiple="multiple">
</select>
</div>
</form>
这里有两个问题。首先要向 select
添加值,您需要向其添加新的 option
元素,而不是重复设置 val()
。其次,您应该在添加选项后调用 multiselect()
。
另请注意,您可以将所有代码放在一个 document.ready 处理程序中。试试这个:
$(function() {
$(document).on('click','#nama_check',function(e){
$.ajax({
type: "POST",
url: "../php/absen/absen_karyawan_autocomplete.php",
dataType: 'json',
success: function(data) {
var html = '';
for(var i = 0; i < data.length; i++) {
html += '<option>' + data[i]['bagian'] + '</option>';
}
$('#chkveg').html(html).multiselect({
includeSelectAllOption: true
});
}
});
});
});
使用.append()。 尝试查看此文档:http://api.jquery.com/append/
dataType: 'json',
success: function(data){
var list = JSON.parse(data);
for(var i=0; i < list.length; i++){
$('#chkveg').append($('<option>'+ list[i]['bagian'] +'</option>'));
}
return false;
}