Post value is not inserting in dynamic generted row in php form

[itzumar]

i have small php form (with dynamic generated input rows) where i need one value from previous form. that value successfully inserted in first row. but when i dynamically generate more rows than that value is not automatically insert in that rows.

here is previous form post value

<?php
error_reporting(E_ERROR | E_WARNING | E_PARSE);
if($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['submit']))
{
        $id1 = $_POST['id1'];
        $company = $_POST['company'];
      **  $empid = $_POST['empid'];**
        $empname = $_POST['empname'];
}

and this is my new form where i want that empid should automatically insert in all rows.

<table class="table table-bordered">
    <thead class="table-success" style="background-color: #3fbbc0;">
        <tr>
            <th><center>Empid</th>
            <th><center>Subject</th>
            <th>
                <button
                    type="button"
                    class="btn btn-sm btn-success"
                    onclick="BtnAdd()"
                >
                    Add Item
                </button>                         
            </th>
        </tr>
    </thead>
    <tbody id="TBody">
        <tr id="TRow" class="d-none">
            <td>
                <input
                    type="text"
                    name="empid[]"
                    id="empid"
                    value="<?php echo $empid; ?>"
                    class="zzz1 form-control text-end"
                >
            </td>
            <td>
                <input
                    type="text"
                    name="subject[]"
                    id="subject"
                    class="state form-control text-end"
                    required
                >
            </td>
            <td class="NoPrint">
                <button
                    type="button"
                    class="btn btn-success"
                    style="line-height: 1;"
                    onclick="BtnDel(this)"
                >
                    x
                </button>
            </td>
        </tr>
    </tbody>
</table>

here is java script code which generate dynamic rows for input

<script type="text/javascript">

function GetPrint()
{
    /*For Print*/
    window.print();
}

function BtnAdd()
{
    /*Add Button*/
    var v = $("#TRow").clone().appendTo("#TBody") ;
    $(v).find("input").val('');
    $(v).find("input").autocomplete({
        source: 'backend-script.php'  
    });
    $(v).removeClass("d-none");
    $(v).find("th").first().html($('#TBody tr').length - 1);
}

function BtnDel(v)
{
    /*Delete Button*/
    $(v).parent().parent().remove(); 
    GetTotal();

    $("#TBody").find("tr").each(function(index) {
        $(this).find("th").first().html(index);
    });
}

i tried following but its duplicate all the data of first rows instead of just required field which is empid

 let ip = $(v).find("input"); //Dont find more than once.
  ip.val(ip.prop($empid));

[mabismad]

The markup you are using is supposed to be used with bootstrap, where the d-none class means display none. The first tr element is a non-displayed template that gets cloned and appended to the table body, where the d-none class is remove, causing the appended row to be displayed. If you were doing this correctly, there would be no user entered value(s) in the first row and you won’t need to clear them in the appended rows.

If you can initially see first row, you are misusing this code. If you must click the “add item” button once to see the first row of form fields, you are using this code the way it was written.

This however causes another problem in that you have hidden form field(s) with the required attribute, which produces an error in the browser.

You will also have another problem with the current method in that the first hidden row will contain empty values in the submitted data.

You also have a copy/paste error in this, because the code is trying to display a row count in a <th></th> tag that doesn’t exist.

I’m pretty sure you have been shown code elsewhere using a <template> tag to do this? This is the easy way to do this, since the markup inside the <template> isn’t actually rendered and you can have required attributes in it.

[itzumar]

Respected Sir!
but my problem is solved by just adding below code in java script section. but I learned alot from your answer. lot of thanks sir for that.

$(v).find("input").each((idx,ele) => ele.value=ele.defaultValue);