将新行添加到在某些单元格中具有某些下拉列表的表中

Question

只是想知道你们中是否有人有任何代码（JQuery，AJAX等）向表中添加新行，该表在某些列中有一些下拉列表...我能够通过添加一些javascript和jQuery，但是由于某种原因（它曾经工作过，但是突然停了下来，我无法回忆起我说的最后一次更改），它不再起作用了。 首先，我使用PHP函数从数据库中检索下拉菜单的内容。 然后，我在Java脚本函数（“ Addnewrow（）”）中添加了HTML代码，以添加新行并将下拉列表包括在特定列中。 事实是，仅当我删除包含PHP函数（“ creaLista”）的“ Addnewrow（）”函数中的行时，才添加行。 我尝试过更改Jquery版本，删除所有引导文件等，但是没有任何效果。 我还在单引号和双引号的行中尝试了不同的组合。 我还删除了非必需的代码，例如selectpicker的“ Render”部分

这是javascript部分：

function addnewrow()
{

    $('.selectpicker').selectpicker('render');

    var n = ($('.detail tr').length-0)+1;
    var tr = "<tr>" +
                    '<td class="no">' + n + '</td>'+
                    "<td><?php creaLista('mrditemid[]',3,'SPARES_ID','SPARES_BRIEFDESC',$query2, $m);?></td>"+
                    "<td><?php creaLista('mrdunits[]',4,'UNIT_ID','UNIT_DESC',$query2, $m);?></td>"+
                    '<td><input type="text" class="form-control mrdquantity" name="mrdquantity[]"></td>'+
                    '<td><input type="text" class="form-control mrdremarks" name="mrdremarks[]"></td>'+

                    '<td><button class="btnDelete btn btn-danger">-</td>'+
             '</tr>';

    $('.detail').append(tr);
}

我可能会补充说，第一行是用HTML自动生成的，也调用了相同的函数“ crealista”，并且效果很好。 现在，当我单击触发“ Addrow（）”函数的按钮时，它什么都不做，而当我删除包含“ Crealista”函数的行时，它确实起作用了，所以它与var“ tr”的方式有关我正在阅读...

预先感谢您对此的任何见解！

Answer 1

> function CopyRow(e) {
>             var r = confirm("Do you want to Copy this record?");
>             if (r == true) {
> 
>                 var $tr = $(e).closest('tr');
>                 var $clone = $tr.clone();
>                    var lastRow = $tr.clone();
> 
>                 lastRow.find('select').each(function (idx, el) {
>                     var $el = $(el);
>                     $el.val($tr.find('select').eq(idx).val())
>                 });
>                 $tr.after(lastRow);
>               
> 
>             }
> 
>             else {
>                 return false;
>             }
>         }

它将添加新行，并且还将复制前一行。

Answer 2

您不能像使用方式那样在JS内使用PHP。 为了实现您的目标，您需要使用AJAX术语。

现在您将如何使用？ 请参见下面的代码。

考虑您有misc.js文件。 （misc.js只是随机名称）。

function addnewrow()
{
    $('.selectpicker').selectpicker('render');
    var n = ($('.detail tr').length-0)+1;

    // Make Ajax Call 
    $.get( "ajax/get-next-row.php", { row: n }, function( tr ) {
        $('.detail').append(tr);
    });
}

得到-下row.php

/* ----------  Get row query parameter from AJAX GET  ---------- */
$n = $_GET['row'];


/* =============================================
  =            Section : Table row logic            =
  ============================================= */

// Write here your row logic and pass it to tr.
// E.g: 
define('SPARES_ID', 'xxx');
define('SPARES_BRIEFDESC', 'xxx');
define('UNIT_ID', 'xxx');
define('UNIT_DESC', 'xxx');
$query2 = '';
$m = '';
/* =====  End of Section  ====== */


/* ----------  Generate Table Row  and return it---------- */
echo $tr = '<tr> '
 . '<td class="no">' . $n . '</td>'
 . '<td>' . creaLista('mrditemid[]', 3, SPARES_ID, SPARES_BRIEFDESC, $query2, $m) . '</td>'
 . '<td>' . creaLista('mrdunits[]', 4, UNIT_ID, UNIT_DESC, $query2, $m) . '</td>'
 . '<td><input type="text" class="form-control mrdquantity" name="mrdquantity[]"></td>'
 . '<td><input type="text" class="form-control mrdremarks" name="mrdremarks[]"></td>'
 . '<td><button class="btnDelete btn btn-danger">-</td>'
 . '</tr>';
exit();