We Keep Coding

How to put an alert in a form

I have a table and i am adding new rows by cloning the existing row. I want to put an alert over my whole table that if any field is left empty an alert should pop-up stating to fill that particular column.I have tried doing this but my alert is only applicable for the first row.Any help will be appreciated.Thanks.
$('#dataTable input:not([type=button]),#dataTable select').each(function () {
var l_search = $( "#fldsearch" ).val();
if( l_search === 'S' || l_search === "" )
{
alert('Please select from the drop down');
return false;
}
var l_desc = $( "#flddesc" ).val();
if( l_desc === "" )
{
alert('Please fill the description');
return false;
}
var l_img = $( "#fldimg" ).val();
if( l_img === "")
{
alert('Please fill the image path');
return false;
}
var l_url = $( "#fldurl" ).val();
if( l_url === "" )
{
alert('Please fill the url');
return false;
}}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table border="0" cellspacing="1" cellpadding="1" id="dataTable" name="dataTable" class="graphtable">
<thead>
<tr>
<td class="headingalign" width="16%">Links</td>
<td class="headingalign" width="32%">Desciption</td>
<td class="headingalign" width="16%">Image</td>
<td class="headingalign" width="16%">URL</td>
<td class="headingalign" width="05%"></td>
</tr>
</thead>
<tbody>
<tr id="id0" class="vals" name="id0">
<td>
<div class="id_100">
<select type="select-one" id='fldsearch' class="objselect" name="fldsearch" onChange="disableField(this)">
<option value="S">Select</option>
<xsl:for-each select="faml/response/qlwidgetresponsedto/searchby/datamapdto">
<xsl:sort order="ascending" select="description" />
<option value="#{description}">
<xsl:value-of select="description" />
</option>
</xsl:for-each>
</select>
</div>
</td>
<td>
<input id="flddesc" name="flddesc" maxlength="500" disabled="true" class="objinputtext1" size="85" value="{//RESPONSE}" />
</td>
<td>
<input id="fldimg" name="fldimg" maxlength="50" disabled="true" class="objinputtext2" size="45" value="{//RESPONSE}" />
</td>
<td>
<input id="fldurl" name="fldurl" maxlength="55" disabled="true" class="objinputtext3" size="40" value="{//RESPONSE}" />
</td>
<td>
<input tabindex="6" value="Delete Row" disabled="true" class="DeleteButton" type="button" />
</td>
</tr>
</tbody>
</table>
<div class="buttonarea">
<ul>
<li><input tabindex="6" id="Button3" value="Add New Row" class="Buttons" name="Button3" type="button" /></li>
<li><input tabindex="6" id="Button5" value="Initiate" class="buttons" name="Button5" type="button" onclick="return fnOnSubmit();" /></li>
</ul>
</div>

Alert for empty field in table using jQuery

I have created a table and added a button 'Add Row' which will clone the row of the table and append it with the previous row. I have put an alert for which if any of the fields is left empty then user should not be able to add a new row.It seems to be working when i hard-coded the drop down values. Now since I am fetching my drop down values from the local db it always shows alert("Please fill all the fields in the current row") after filling all the fields. Any suggestion will be appreciated. Thanks
```````````````````````jQuery``````````````````````````
var regex = /^([a-zA-Z0-9 _-]+)$/;
var cindex = 0;
$(document).on('click','.Buttons', function(e) {
var count = $('table tr:last input:text').filter((_,el) => el.value.trim() == "").length;
if(count || !$('select:last').val()){
alert("Please fill all the fields in the current row");
return false;
}
var $tr = $('#dataTable tbody tr:last');
var $clone = $tr.clone(true);
cindex++;
$clone.find(':input').not('select').not('.DeleteButton').val('').attr('disabled', true);
$clone.attr('id', 'id'+(cindex) ); //update row id if required
//update ids of elements in row
$clone.find("*").each(function() {
var id = this.id || "";
if(id != ""){
var match = id.match(regex) || [];
if (match.length == 2) {
this.id = this.name + (cindex);
}
}
});
$tr.after($clone);
});
HTML
<table border="0" cellspacing="1" cellpadding="1" id="dataTable" class="graphtable">
<thead>
<tr>
<td class="headingalign" width="16%">Links</td>
<td class="headingalign" width="32%">Desciption</td>
<td class="headingalign" width="16%">Image</td>
<td class="headingalign" width="16%">URL</td>
<td class="headingalign" width="05%"></td>
</tr>
</thead>
<tbody>
<tr id="id01" name="row">
<td><select type="select-one" id='fldsearch' class="objselect" name="fldsearch" onChange="disableField()" >
<option value="">Select</option>
<xsl:for-each select="{Values fetching from local db}">
<xsl:sort order="ascending" select="description"/>
<option value="{code}"> <xsl:value-of select="description"/> </option>
</xsl:for-each>
</select></td>
<td><input id="flddesc" name="flddesc" maxlength="500" disabled="true" class="objinputtext" size="85" value="{//RESPONSE}" /></td>
<td><input id="fldimg" name="fldimg" maxlength="50" disabled="true" class="objinputtext" size="35" value="{//RESPONSE}" /></td>
<td><input id="fldurl" name="fldurl" maxlength="15" disabled="true" class="objinputtext" size="35" value="{//RESPONSE}" /></td>
<td><input tabindex="6" value="Delete Row" disabled="true" class="DeleteButton" type="button" /></td>
</tr>
</tbody>
</table>
<div class="buttonarea">
<ul>
<li>
<input tabindex="6" id="Button3" value="Add New Row" class="Buttons" name="Button3" type="button" />
</li>
<li>
<input tabindex="6" id="Button5" value="Initiate" class="buttons" name="Button5" type="button" onClick="return fnOnSubmit();"/>
</li>
</ul>
</div>

take value data & Delete row table with javascript

I have 3 problems with this javascript.
User cant add more item if already limit.
Example max item 3, and value item is ab,bc,cd, how I can take value if using javascript (after all done user will be press submit then all data from table will be post (i cant take data from javascript))?
what I want build is like this : Example 2 item
|Total Item | Name Item | Delete |
| 1 | ABC | DELETE(BUTTON) |
| 2 | CDE | DELETE(BUTTON) |
This is html code, example max item is 6
<table border="0">
<tr>
<td>
Title
</td>
<td>
:
</td>
<td>
<input type="text" name="title" value="" placeholder="Input Title">
</td>
</tr>
<tr>
<td>
Show Item
</td>
<td>
:
</td>
<td>
<select name="max" id="maxitem">
<?php
for($i=1; $i<=6; $i++)
{
echo "<option value=".$i.">".$i." Item</option>";
}
?>
</select>
</td>
</tr>
<tr>
<td>
Product
</td>
<td>
:
</td>
<td>
<input type="text" name="product" id="product" value="" placeholder="Add Product">
</td>
<td>
<input type="button" id="ADD" value="Add Item">
</td>
</tr>
</table>
<table border="1" id="tblname">
<thead>
<tr>
<td>
Total Item
</td>
<td>
Name Item
</td>
<td>
DELETE
</td>
<tr>
</thead>
<tbody>
<tr>
<td>
</td>
</tr>
</tbody>
</table>
<input type="submit" value="SUBMIT">
and this is javascript code :
$(document).ready(function(){
var item = 1;
$('#ADD').click(function(){
var maxitem = parseInt($("#maxitem").val()); //from max item in html
if($('#product').val()){ // check input product
if( item <= maxitem )
{
$('#tblname tbody').append($("#tblname tbody tr:last").clone());
$('#tblname tbody tr:last td:first').val(item);
$('#tblname tbody tr:last td:first').html($('#product').val());
$('#tblname tbody tr:last td:first').append("<input type='button' class='DEL' value='DELETE'>");
var item +=1;
}
else
{
alert ("Max Limit !!!");
}
}else{alert('Enter Text');}
});
// for delete row
$('body').on('click', 'input.DEL', function() {
$(this).parents('tr').remove();
});
});

<html>
<head>
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script>
$(document).ready(function(){
var item = 1;
$('#ADD').click(function(){
var maxitem = parseInt($("#maxitem").val(), 10); //from max item in html
var iCount = 0;
if($('#product').val()){ // check input product
if( item <= maxitem )
{
iCount = $('#tblname tbody tr').length + 1;
szTr = "<tr><td>";
szTr = szTr + iCount + "</td>";
szTr = szTr + "<td>" +$('#product').val() +"</td>";
szTr = szTr + "<td><input type='button' class='DEL' value='DELETE'></td>";
szTr = szTr + "</tr>";
$('#tblname tbody').append(szTr);
item = item+1;
}
else
{
alert ("Max Limit !!!");
}
}else{alert('Enter Text');}
});
// for delete row
$('body').on('click', 'input.DEL', function() {
$(this).parents('tr').remove();
});
$('#get_data').click(function () {
$('#tblname tbody tr').each(function () {
alert($(this).find('td:eq(1)').text());
});
});
});
</script>
</head>
<body>
<table border="0">
<tr>
<td>
Title
</td>
<td>
:
</td>
<td>
<input type="text" name="title" value="" placeholder="Input Title">
</td>
</tr>
<tr>
<td>
Show Item
</td>
<td>
:
</td>
<td>
<select name="max" id="maxitem">
<option value="1">Item1</option>
<option value="2">Item2</option>
<option value="3">Item3</option>
<option value="4">Item4</option>
<option value="5">Item5</option>
<option value="6">Item6</option>
</select>
</td>
</tr>
<tr>
<td>
Product
</td>
<td>
:
</td>
<td>
<input type="text" name="product" id="product" value="" placeholder="Add Product">
</td>
<td>
<input type="button" id="ADD" value="Add Item">
</td>
</tr>
</table>
<table border="1" id="tblname">
<thead>
<tr>
<td>
Total Item
</td>
<td>
Name Item
</td>
<td>
DELETE
</td>
<tr>
</thead>
<tbody>
</tbody>
</table>
<input type="button" value="Get Data" id="get_data">
<input type="submit" value="SUBMIT">
</body>
</html>

See if this is what you are trying to do, your description is hard to decipher:
DEMO: https://jsfiddle.net/d8kpsnxx/
<table border="0">
<tr>
<td>Title</td>
<td>:</td>
<td><input type="text" name="title" value="" placeholder="Input Title"></td>
</tr>
<tr>
<td>Show Item</td>
<td>:</td>
<td>
<select name="max" id="maxitem">
<option value=1>1 Item</option>
<option value=2>2 Item</option>
<option value=3>3 Item</option>
<option value=4>4 Item</option>
<option value=5>5 Item</option>
<option value=6>6 Item</option>
</select>
</td>
</tr>
<tr>
<td>Product</td>
<td>:</td>
<td><input type="text" name="product" id="product" value="" placeholder="Add Product"></td>
<td><input type="button" id="ADD" value="Add Item"></td>
</tr>
</table>
<table border="1" id="tblname">
<thead>
<tr>
<td>
Total Item
</td>
<td>
Name Item
</td>
<td>
DELETE
</td>
<tr>
</thead>
<tbody id="cracker">
</tbody>
</table>
<input id="submitall" type="submit" value="SUBMIT">
<script>
$(document).ready(function() {
var isAllowed = 3;
var isSet = 0;
$(this).on('click',"#ADD",function(e) {
// Prevent submission
e.preventDefault();
// Set all the value object
var drop = $("select[name=max]");
var title = $("input[name=title]");
var prod = $("input[name=product]");
// Append the table
$("#cracker").append('<tr><td>'+title.val()+': '+prod.val()+'</td><td>'+drop.val()+'</td><td><input type="submit" class="dMade" name="'+drop.val()+'" value="DELETE" /></td></tr>');
// Clear all the values to start over
drop.val("");
title.val("");
prod.val("");
// Auto increment
isSet++;
// Turn off/on submit buttons
restFormOpts();
});
$(this).on('click',".dMade",function(e) {
var traversed = $(this).parents("tr");
traversed.remove();
isSet--;
restFormOpts();
});
function restFormOpts()
{
if(isSet === isAllowed) {
$("#ADD").attr("disabled",true);
$("#submitall").attr("disabled",false);
}
else {
$("#ADD").attr("disabled",false);
$("#submitall").attr("disabled",true);
}
}
});
</script>

Edit specific row and reset particular fields of a form not working

I have created a form, here when click on edit button from a dynamically created table it is not fetching the form values.
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title> Generate Challan </title>
<link type="text/css" href="styles.css" rel="stylesheet" />
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="http://code.google.com/p/jquery-json/downloads/detail?name=jquery.json-2.2.min.js"></script>
<script type="text/javascript">
data = new Array();
$(document).ready(function(){
$(".addbutton").click(function() {
var row = new Array(12);
row[0] = $("#txtbox1").val();
row[1] = $("#txtbox2").val();
row[2] = $("#txtbox3").val();
row[3] = $("#txtbox4").val();
row[4] = $("#H1").val();
row[5] = $("#I1").val();
row[6] = $("#G1").val();
row[7] = $("#J1").val();
row[8] = $("#B1").val();
row[9] = $("#C1").val();
row[10] = $("#D1").val();
row[11] = $("#E1").val();
data.push(row);
refresh();
});
$('#myform')[0].reset(); //reset form stmt
//Edit function
var $tds = null;
$('#datatable').on('click', 'td:last-child', function (e) {
var $tr = $(this).parent(),
$tds = $tr.children(),
sname = $tds.eq(0).text().trim(),
mon = $tds.eq(1).text().trim();
year = $tds.eq(2).text().trim();
$('#G1 option').each(function () {
if ($(this).text().trim() == sname) {
$(this).prop('selected', true);
return false;
}
});
$('#H1 option').each(function () {
if ($(this).text().trim() == mon) {
$(this).prop('selected', true);
return false;
}
});
$('#I1 option').each(function () {
if ($(this).text().trim() == year) {
$(this).prop('selected', true);
return false;
}
});
$('#J1').val($tds.eq(3).text().trim())
$('#E1').val($tds.eq(4).text().trim())
e.preventDefault();
});
$("#myform").submit(function(){
var val = $.toJSON(data);
$("#data").attr("value",val);
if(data.length == 0){
alert("Table is empty !");
return false;
}else{
return true;
}
});
});
function refresh(){
$("#datatable").find("tr:gt(1)").remove();
publishtable();
}
function publishtable(){
for(var c=0;c<data.length;c++){
var trow = $('<tr valign="middle">').addClass("contact");
$("<td>").text(c+1).appendTo(trow);
for(var i=0;i<12;i++){
$("<td>").text(data[c][i]).appendTo(trow);
}
var abutton = $('<input type="button" class="editrow" value="Edit">');
var acell = $("<td>");
abutton.appendTo(acell);
acell.appendTo(trow);
$("#datatable").append(trow);
}
}
//Summation
function sum() {
var txtFirstNumberValue = document.getElementById('B1').value;
var txtSecondNumberValue = document.getElementById('C1').value;
var txtThirdNumberValue = document.getElementById('D1').value;
var result = parseFloat(txtFirstNumberValue) + parseFloat(txtSecondNumberValue) + parseFloat(txtThirdNumberValue);
if (!isNaN(result)) {
document.getElementById('E1').value = result;
}
}
</script>
</head>
<body>
<h2><center>Sample Form</center></h2>
<h5><center>(Rule 23(1) &AMP; Rule 24(1))</center></h5>
<br/><br/>
<table border="0">
<tr>
<td><label for="name">Received from Shri:</label></td>
<td><input type="text" name="name" id="txtbox1" class="txtbox"> </td>
</tr>
<tr>
<td><label for="address">Address:</label></td>
<td><input type="text" name="address" id="txtbox2" class="txtbox"> </td>
</tr>
<tr>
<td><label for="address">Email:</label></td>
<td><input type="text" name="email" id="txtbox3" class="txtbox"> </td>
</tr>
<tr>
<td><label for="mobileNo">Mobile No:</label></td>
<td><input type="text" name="mobile" id="txtbox4" class="txtbox"> </td>
</tr>
<tr>
<td> <label for="month">Month:</label></td>
<td><select name="month" id="H1">
<option>Select Month</option>
<option>January</option>
<option>February</option>
<option>March</option>
<option>April</option>
<option>May</option>
<option>June</option>
<option>July</option>
<option>August</option>
<option>September</option>
<option>October</option>
<option>November</option>
<option>December</option>
</select></td>
<td><label for="year">Year:</label></td>
<td><select name="year" id="I1">
<option>Select Year</option>
<option>2014</option>
<option>2015</option>
<option>2016</option>
<option>2017</option>
</select><td>
</tr>
<tr>
<td><label for="serviceName">Service Name:</label></td>
<td><select name="G1" id="G1">
<option>services</option>
</select></td>
</tr>
<tr>
<td><label for="details">Details:</label></td>
<td><input type="text" name="details" id="J1" class="txtbox" ></td>
</tr>
<tr>
<td><label for="tax">Tax:</label></td>
<td><input type="text" name="tax" id="B1" value="" class="txt" onkeyup="sum();" /></td>
</tr>
<tr>
<td><label for="cess">Cess:</label></td>
<td><input type="text" name="cess" id="C1" value="" class="txt" onkeyup="sum();" /></td>
</tr>
<tr>
<td><label for="penalty">Interest/Penalty:</label></td>
<td><input type="text" name="penalty" id="D1" value="" class="txt" onkeyup="sum();" /></td>
</tr>
<tr>
<td><label for="total">Total:</label></td>
<td><input type="text" name="total" id="E1" value="" class="txtbox" /></td>
</tr>
<td>
<input type="button" name="mybutton" class="addbutton" id="addbutton" value="Add">
</td>
</tr>
</table>
<br/>
<br/>
<br/><br/><br/>
<table id="datatable" class="contacts" border="1">
<thead>
<tr>
<td class="contactDept" colspan="13">Generated rows</td>
</tr>
</thead>
<tbody>
<tr class="contact_head">
<td>S.No.</td>
<td>Name</td>
<td>Address</td>
<td>Email</td>
<td>Mobile</td>
<td>Month</td>
<td>Year</td>
<td>Service</td>
<td>Details</td>
<td>Tax</td>
<td>Cess</td>
<td>Penalty</td>
<td>Total</td>
<!--<td><a href="#" >Edit</a></td>-->
</tr>
</tbody>
</table>
<br/>
<form id="myform" action="save/saveTable.action" method="post">
<input type="hidden" id="data" name="data">
<input type="submit" name="submitbutton" class="submitbutton" id="submitbutton" value="Submit Form">
</form>
Here when click on add, form values are displaying on the table. When click on submit button, I am passing the table(dynamically generated table) to some action class. Before submitting the table I have to perform edit operation. I have written a code for edit function but unable to edit. Please help me to solve..

You made a mistake in your var declaration.
For exemple, you have written mon = $tds.eq(1).text().trim();
It should be mon = $tds.eq(5).text().trim();
Because $tds.eq(1) is the name, not the month.
That's why
$('#H1 option').each(function () {
if ($(this).text().trim() == mon) {
$(this).prop('selected', true);
return false;
}
});
never appends.
Please see this working demo
UpDate 1 :
$('#datatable').on('click', 'td:last-child', function (e) {
var $tr = $(this).parent(),
$tds = $tr.children(),
name = $tds.eq(1).text().trim(),
adress = $tds.eq(2).text().trim(),
email = $tds.eq(3).text().trim(),
mobile = $tds.eq(4).text().trim(),
mon = $tds.eq(5).text().trim(),
year = $tds.eq(6).text().trim(),
service = $tds.eq(7).text().trim(),
details = $tds.eq(8).text().trim(),
tax = $tds.eq(9).text().trim(),
cess = $tds.eq(10).text().trim(),
penalty = $tds.eq(11).text().trim(),
sum = $tds.eq(12).text().trim();
...

How to get the dynamically cloned table textbox value?

All,
I have table which I am cloning on clicking on button and after cloning table I need to do few calculation in the cloned table as well as in parent table. My problem is that I am not able to do calculation on each appended(clone) table. I mean I wrote a on blur function to do calculation with textbox value but when I am cloning table since class name is same for all textbox, in parent and cloned table my result showing in all textbox instead of corresponding part of the table. Here is my table and my jquery code which I am following.
<html>
<body>
<table>
<tbody>
<tr><td>
<table width="95%" border="0" cellspacing="5" cellpadding="5" style="margin-left:10px;" id="product">
<thead><tr>
<td class="mandatory"> * Product Name </td>
<td class="label"> Qty.in Stock</td>
<td class="mandatory">* Qty </td>
<td class="mandatory">* Unit Price</td>
<td class="mandatory">* List Price</td>
<td class="mandatory">* Total</td>
</tr>
</thead>
<tbody class="product_details" id="tbody_product">
<tr class="tr_product_details">
<td>
<input type="text" name="txtproductName[]" id="product-name" />
<a href="">
<img width="17" height="16" src="images/Products_small.gif"> </a>
<input type="hidden" name="productid[]" id="productid" />
</td>
<td>
<input type="text" name="txtqtyStock[]" id="productstock" />
</td>
<td>
<input type="text" name="txtQty" id="product-quatity" class="product-qty" value="3" />
</td>
<td>
<input type="text" name="txtUnitPrice[]" id="product-price" />
</td>
<td>
<input type="text" name="txtListPrice[]" id="product-list-price" class="product-list-price"
/>
</td>
<td><div style="margin-left:120px;">
<input type="text" name="txtTotal[]" size="10" class="total-price" />
</div>
</td>
</tr>
<tr>
<td colspan="5"> <img width="17" height="16" src="images/spacer.gif">Product Description </td>
</tr>
<tr>
<td colspan="5"><textarea style="width:65%" maxlength="250" rows="3" cols="30" name="txtProductDescription[]" id="textarea-product-description"></textarea>
</td>
<td colspan="1" class="tbl">
<table >
<tr>
<td>Discount: </td>
<td> <input type="text" name="txtProductDiscount[]" size="10" class="product-discount" /></td>
</tr>
<tr>
<td class="label">Total After Discount: </td>
<td> <input type="text" name="txtAfterDiscount[]" size="10" class="total-after-discount" /></td>
</tr>
<tr>
<td> Tax: </td>
<td><input type="text" name="txtProductTax[]" size="10" />
</td>
</tr>
<tr>
<td class="label"> Net Total: </td>
<td><input type="text" name="txtNetTotal[]" size="10" class="net-total" /> </td>
</tr>
</table>
</td>
</tr>
</tbody>
</table>
<table align="left" style="margin-left:20px;">
<tr>
<td><input type="button" id="btnaddProduct" value="Add Product" class="button"/> </td>
</tr>
</table>
</body>
</html>
And my script which I am using :
<script type="text/javascript">
$(document).ready(function () {
var parent_qty_id = $("#product tbody:first").attr('id');
var qty_attr = parent_qty_id+" tr:first .product-qty";
$("#"+qty_attr+" .product-qty").bind("blur change",function(){
var product_qty = $(this).val(), product_list_price = $('#product tr td .product-list-price').val(),total;
total = product_qty * product_list_price;
// alert( $(this).children().children().attr("class"));
// $(this).children().children().attr("class");
var val = $(this).children();
$(val).val(total+'.00');
});
$("#btnaddProduct").click(function() {
var count = ($("tbody .product_details").length) + 1;
var tblid = $("#product tbody:first").attr('id');
var newid = tblid+"_"+count;
$('#product tbody:first').clone(true).insertAfter('#product > tbody:last').attr("id",newid);
$('table#product > tbody:last > tr:first input').val(' ');
$('table#product > tbody:last > tr:last input').val(' ');
$(":text.product-qty").last().val();
return false;
});
});
</script>

$("#"+qty_attr+" .product-qty")
Comes out empty (no element selected) because you already added .product-qty in parent_qty_id to qty_attr.
$("#"+qty_attr)
Works.
There were alot of other errors in your code which made the blur/change routine run twice etc. I've sanitized it some into this:
$(document).ready(function () {
var parent_qty_id = $("#product tbody:first").attr('id');
var qty_attr = parent_qty_id+" tr:first .product-qty";
$("#"+qty_attr).blur(function(){
var product_qty = $(this).val(), product_list_price = $('#product tr td .product-list-price').val(),total;
total = product_qty * product_list_price;
var val = $(this).children();
$(val).val(total+'.00');
});
$("#btnaddProduct").click(function(e) {
e.preventDefault();
var count = ($("tbody .product_details").length) + 1;
var tblid = $("#product tbody:first").attr('id');
var newid = tblid+"_"+count;
$('#product tbody:first').clone(true).insertAfter('#product > tbody:last').attr("id",newid);
$('table#product > tbody:last > tr:first input').val(' ');
$('table#product > tbody:last > tr:last input').val(' ');
$(":text.product-qty").last().val();
});
});
Further tweaking is probably needed.