clearing specifc fields when using jquery clone

Question

I have created a j query script to allow me to clone the last row of a table however i would like 2 of the columns to be empty on the clone. I am only able totally empty one of the fields any help on this would be greatly appreciated.

html for the table:

    <tbody>
                <tr>  
                  <td><input id="wInv_work_Id0" name="wInv_work_Id0" type="text" readonly="true" value="<%=rswork2.getString(1)%>"></td>
                  <td><select id="invTru_Type0" name="invTru_Type0" onchange="getTruckPlates(this.value, this.id)">
                      <option disabled selected hidden value="">Select A Truck Type</option>
                      <%while(rsinvTru1.next()){%>
                      <option><%=rsinvTru1.getString(1)%></option>
                      <%}%>
                    </select> </td>
                  <td><select class="selectLp" id="invTru_LicensePlateNo0" name="invTru_LicensePlateNo0" >
                      <option disabled selected hidden value="">Select A Truck</option>
                    </select></td>
                  <td><select id="driver_emp_Id0" name="driver_emp_Id" >
                      <option disabled selected hidden value=""></option>
                    </select></td>
                  <!--<td><input id="driver_emp_Id0" name="driver_emp_Id0" value=" " readonly="true" type="text"></td>-->
                  <td><input id="wInv_JobNo0" name="wInv_JobNo0" type="text"></td>
</tr>
                  </tbody>

j query that allows clone

 $(document).ready(function () {
            $("#btn_AddTruck").click(function () {
               var $tableBody = $('#tbl_invTruck').find("tbody"),
                $trLast = $tableBody.find("tr:last"),
                $trNew = $trLast.clone();
                // Find by attribute 'id'
                $trNew.find('[id]').each(function () {
                    var num = this.id.replace(/\D/g, '');
                    if (!num) {
                        num = 0;
                    }
                    // Remove numbers by first regexp
                    this.id = this.id.replace(/\d/g, '') 
                        // increment number
                        + (1 + parseInt(num, 10));
                });


                $trLast.after($trNew); 
                $trNew.find('select').val('');



            });
        });

I would like that on clone the driver_emp_Id0 and wInv_JobNo0 values be set to empty.Please note that the ids of the clones are being incremented by 1 on the clone

Your html has no table rows indicated? – aduss Jun 30 '17 at 18:53 — aduss, Jun 30 '17 at 18:53
sorry about that i put them in – Jeremey Samaroo Jun 30 '17 at 19:00 — Jeremey Samaroo, Jun 30 '17 at 19:00
Updated my answer, should be good to go now. – aduss Jun 30 '17 at 19:50 — aduss, Jun 30 '17 at 19:50

aduss · Answer 1 · 2017-06-30T19:29:31.853

0

So the problem is that jquery by default does not duplicate input select stuff.

The second answer here is the one I used for the fiddle below. Clone isn't cloning select values and is more or less a duplicate of this. Essentially it creates a new clone function that will copy the vals.

Here is the working solution https://jsfiddle.net/t953917v/3/

$(cols[cols.length - 1]).find('select, input').val("");
$(cols[cols.length - 2]).find('select, input').val("");

edited Jun 30 '17 at 19:29

answered Jun 30 '17 at 19:14

aduss

556
3
12

i tried this, however it clears all the input fields where as i am trying to only clear one select field and one input field which are both the last 2 fields. Thanks for the suggestion, you time an effort is greatly appreciated. – Jeremey Samaroo Jun 30 '17 at 19:17
@JeremeySamaroo Sorry I did not understand the question at first. The solution I posted now does the trick. – aduss Jun 30 '17 at 19:30

clearing specifc fields when using jquery clone

1 Answers1