gpt4 book ai didi

javascript - 在数据表中添加 html 标记添加行

转载 作者:行者123 更新时间:2023-11-29 04:38:08 24 4
gpt4 key购买 nike

我想在数据表中动态实现 addrow 但不知何故我无法通过在新添加的行中添加 html 标记来让它工作并且选择数据不显示。

这是我的js,

    $('#productselect').each(function(index, value){
var initSelectpicker = $(this).selectpicker();
$.getJSON('../../../html/data/productlist.php', function(data){

initSelectpicker.html('');
$.each(data, function(key, val){
initSelectpicker.append('<option value="' + val["prod_desc"] + '">'+ val["prod_desc"] + '</option>');
});
initSelectpicker.selectpicker('refresh');
});
}); //end flightselect
$(document).ready(function() {
var t = $('#example').DataTable();
var counter = 1;

$('#addRow').on( 'click', function () {
t.row.add([
counter +'.1',
"<select class='form-control' id='productselect' data-live-search='true'>",
counter +'.3',
counter +'.4',
counter +'.5'
]).draw( false );

counter++;
} );

// Automatically add a first row of data
$('#addRow').click();
} );

最佳答案

脚本的第一部分只会在您的页面首次加载时被调用。这就是为什么选择字段填充了来自 productlist.php 的选项。

因此当您尝试添加更多行时,新的选择字段将没有选项。您可以做的是在尝试添加新行时调用 productlist.php

$(document).ready(function() {

var t = $('#example').DataTable();
var counter = 1;

$(document).on('click', '#addRow', function () {

/*** GET ALL OPTIONS ***/
$.getJSON('../../../html/data/productlist.php', function(data){
var newoptions = '';
$.each(data, function(key, val){
newoptions .= '<option value="' + val["prod_desc"] + '">'+ val["prod_desc"] + '</option>';
});
});

t.row.add([
counter +'.1',
'<select class="form-control" id="productselect" data-live-search="true">'+newoptions+'</select>',
counter +'.3',
counter +'.4',
counter +'.5'
]).draw( false );

counter++;
});

// Automatically add a first row of data
$('#addRow').click();
});

关于javascript - 在数据表中添加 html 标记添加行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36392764/

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