在表中添加一个新行，在某些单元格中有一些下拉列表

Just wanted to know if any of you had any code (JQuery, AJAX, etc) to add a new row to a table that has some dropdown lists in some columns... I was able to add a new row by adding some javascript and jquery, but for some reason (it was working before, but suddenly stopped and I cannot recall the last changes I made to be honest) it's not working anymore. First, I made PHP functions to retrieve the contents for the dropdowns from a DB. Then I added the HTML code in a java script function ("Addnewrow()") to add the new rows and include the dropdowns in specific columns. Thing is, rows are only added when I remove the lines in the "Addnewrow()" function that contains the PHP function ("creaLista"). I have tried changing the Jquery versions, removing all bootstrap files and so, but nothing works. I also tried different combinations in those lines of single and double quotes. I also removed the non-essential code, such as the "Render" section for the selectpicker

Here's the javascript section:

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);
}

I may add that the first row is generated automaticaly in HTML, also calling the same function "crealista" and it works fine. Now, when I click on the button that triggers the "Addrow()" function it simply does nothing, and when I remove the lines containing the "Crealista" function it does work, so it has to do with how the var "tr" is being read, I believe...

Thanks in advance for any insights on this!

> 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;
>             }
>         }

It will add new row and will also copy the previous row.

You can not use PHP inside JS like how you are using. For achieve your goal you need to use AJAX terminology.

Now how you will use? See the below code.

Consider you have misc.js file. (misc.js is just random name).

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);
    });
}

get-next-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();