I have an invoice.jsp page where I have to calculate some value in the textbox using jQuery or with any other way.
I don't know much about jQuery. Please help me to solve this problem.
In my invoice there is a quantity textbox. If the user enters the quantity then the calculated price should be calculated dynamically i.e (total_subPrice= unit_price * quantity) and shown in another textbox called "price".
And again the total sum of all the prices should appear in the button as a Total.
Please note: all the row values are coming from my database table based on the selection of items by users.
I have used only this code to show values in my invoice.jsp page:
<s:iterator value="#session.BOK" status="userStatus">
<tr style="height: 10px;">
<td width="65%" align="left"><s:property value="bookTitile"/></td>
<td width="10%" align="left"><s:property value="price"/></td>
<td width="10%" align="center"><s:textfield name="quantity" value="%{quantity}" size="2" /></td>
<td width="15%" align="center" >
<s:textfield value="%{price}" name="" size="6"></s:textfield>
</td>
</tr>
</s:iterator>
And my invoice.jsp output looks like this:
I have no idea how to calculate the line Total based on the quantity chosen and also display the sum of all the line total in the grand total textbox (see below invoice image).
I also tried this but I am still unable to solve my problem.
My full JSP code:
<table width="100%" height="50%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="74%">
<s:form action="dfs" id="form3" theme="simple">
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0" id="your_content">
<tr>
<td valign="top" height="10%">
<div id="invNum">Invoice# 12688</div>
<div id="ttielMain">Vision Books</div>
<div id="Orgaddress"> Thamel Kathmandu Nepal</div>
<div id="phoneNum"> Tel# 00977-1-12173803</div>
<div id="websiteOrg"> www.thebestbookfinder.com</div>
</td>
</tr>
<tr>
<td valign="top" width="100%" align="left">
----------------------------------------------------------- -----------------------------------
</td>
</tr>
<tr>
<td height="6%" valign="top" width="100%">
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr style="height: 10px;font-family: serif;font-weight: bold;font-size: 14px;">
<td width="65%" align="left">Title</td>
<td width="10%" align="left">Unit Price</td>
<td width="10%" align="center">Qty</td>
<td width="15%" align="left">Line Total</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="1%" valign="top" width="100%">
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr style="height: 10px;">
<td width="65%" align="left">
-------------------------------------------------------
</td>
<td width="10%" align="left">----------</td>
<td width="10%" align="center">-----</td>
<td width="15%" align="left">-------------</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="65%" valign="top" width="100%">
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<s:iterator value="#session.BOK" status="userStatus">
<tr style="height: 10px;">
<td width="65%" align="left"><s:property value="bookTitile"/></td>
<td width="10%" align="left"><s:property value="price"/></td>
<td width="10%" align="center"><s:textfield name="quantity" value="%{quantity}" size="2" /></td>
<td width="15%" align="center"><s:textfield value="%{price}" name="" size="6"></s:textfield></td>
</tr>
</s:iterator>
</table>
</td>
</tr>
<tr>
<td height="1%" valign="top" width="100%">
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr style="height: 10px;">
<td width="100%" align="right" colspan="5">
------------------------------------
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="1%" valign="top" width="100%">
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr style="height: 10px;">
<td width="100%" align="right" colspan="5" style="font-weight: b">
<s:set var="total" value="%{0}" />
<s:iterator value="#session.BOK">
<s:set var="total" value="%{price + #attr.total}" />
</s:iterator>
<s:textfield name="subtotal" value="%{'' + #attr.total}" size="5"> </s:textfield>
</td>
</tr>
</table>
</td>
</tr>
</tr>
<tr>
<td height="1%" valign="top" width="100%">
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr style="height: 10px;">
<td width="100%" align="right" colspan="5">Discount:<sj:textfield name="amt" size="1" placeholder=" %"/></td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="1%" valign="top" width="100%">
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr style="height: 10px;">
<td width="100%" align="right" colspan="5">
--------------------------------------------------------------------------------------------------
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="1%" valign="top" width="100%">
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr style="height: 10px;">
<td width="100%" align="right" colspan="5" style="font-weight: bolder;">
<s:set var="total" value="%{0}" />
<s:iterator value="#session.BOK">
<s:set var="total" value="%{price + #attr.total}" />
</s:iterator>
Total: <s:property value="%{'' + #attr.total}" />
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="1%" valign="top" width="100%">
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr style="height: 10px;">
<td width="100%" align="right" colspan="5">
--------------------------------------------------------------------------------------------------
</td>
</tr>
</table>
</td>
</tr>
As #flow said, use .change():
$(function() {
$('input[name^="quantity"]').change(function() {
var unitprice = $(this).siblings('input[name^="unitprice"]').val();
$(this).siblings('input[name^="price"]')
.val($(this).val() * unitprice);
});
});
Use .change() on your inputs.
jQuery Docs - Change
Related
link for image i have written a code which sends invoice details via email after completing the order. but the issue is that when i am running this code in a file.php it is working fine and giving me all the value of variable and executing the while loop
But while mailing, the while() function is not getting execueted and the invoice details are appearing null in the email.
The mail consist of details of the shopping which the user had done.
function sentInvoice($conn,$oid)
{
$url="http://localhost/user/contactus.php";
$date=date('Y');
$nego=0;
$res=mysqli_query($conn,"select order_details.*,product.id,product.pname,orders.total_price from order_details inner join product on product.id=order_details.product_id inner join orders on orders.id=order_details.order_id where order_details.order_id='$oid'");
$row=mysqli_fetch_assoc(mysqli_query($conn,"select orders.*, ecom_users.id,ecom_users.fname,ecom_users.email from orders inner join ecom_users on ecom_users.id=orders.uid where orders.id='$oid'"));
$total=0;
$dateArr=explode(" ",$row['added_on']);
$order_date=$dateArr[0];
$html='<body>
<span class="preheader">This is an invoice for your purchase on '.$order_date.'.</span>
<table class="email-wrapper" width="100%" cellpadding="0" cellspacing="0" role="presentation">
<tr>
<td align="center">
<table class="email-content" width="100%" cellpadding="0" cellspacing="0" role="presentation">
<!-- Email Body -->
<tr>
<td class="email-body" width="100%" cellpadding="0" cellspacing="0">
<table class="email-body_inner" align="center" width="570" cellpadding="0" cellspacing="0" role="presentation">
<!-- Body content -->
<tr>
<td class="content-cell">
<div class="f-fallback">
<h1>Hi '.$row['fname'].',</h1>
<p>Thanks for using Our Website ShopHana. This is an invoice for your recent purchase.</p>
<table class="attributes" width="100%" cellpadding="0" cellspacing="0" role="presentation">
<tr>
<td class="attributes_content">
<table width="100%" cellpadding="0" cellspacing="0" role="presentation">
<tr>
<td class="attributes_item">
<span class="f-fallback">
<strong>Amount:'.$row['total_price'].'</strong>
</span>
</td>
</tr>
<tr>
<td class="attributes_item">
</span>
</td>
</tr>
</table>
</td>
</tr>
</table>
<!-- Action -->
<table class="purchase" width="100%" cellpadding="0" cellspacing="0">
<tr>
<td>
<h3>'.$oid.'</h3>
</td>
<td>
<h3 class="align-right">'.$order_date.'</h3>
</td>
</tr>
<tr>
<td colspan="2">
<table class="purchase_content" width="100%" cellpadding="0" cellspacing="0">
<tr>
<th class="purchase_heading" align="left">
<p class="f-fallback">Description</p>
</th>
<th class="purchase_heading" align="right">
<p class="f-fallback">Amount</p>
</th>
</tr>';
while($rem=mysqli_fetch_assoc($res))
{
$pid=$rem['product_id'];
$user_id=$row['uid'];
$a_query=mysqli_fetch_assoc(mysqli_query($conn,"select negotiate from addtocart where pid=$pid and uid=$user_id"));
$nego=$a_query['negotiate'];
echo $nego;
if($nego!=0)
{
$total=$total+$nego;
}
else
{
$total=$total+$rem['price'];
}
//this part is not showing up in the email
$html.='
<tr>
<td width="80%" class="purchase_item"><span class="f-fallback">'.$rem['pname'].'</span></td>
<td class="align-right" width="20%" class="purchase_item"><span class="f-fallback">'.$rem['price'].'</span></td>
</tr>';
}
$html.='<tr>
<td width="80%" class="purchase_footer" valign="middle">
<p class="f-fallback purchase_total purchase_total--label">Total</p>
</td>
<td width="20%" class="purchase_footer" valign="middle">
<p class="f-fallback purchase_total">'.$total.'</p>
</td>
</tr>
</table>
</td>
</tr>
</table>
<p>If you have any questions about this invoice, simply reply to this email or reach out to our support team for help.</p>
<p>Cheers,
<br>The ShopHana Team</p>
<!-- Sub copy -->
</div>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table class="email-footer" align="center" width="570" cellpadding="0" cellspacing="0" role="presentation">
<tr>
<td class="content-cell" align="center">
<p class="f-fallback sub align-center">©'.$date.' ShopHana All rights reserved.</p>
<p class="f-fallback sub align-center">
[SHOPHANA, LLC]
<br>1234 Street Rd.
<br>Suite 1234
</p>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>';
include('smtp/PHPMailerAutoload.php');
$mail=new PHPMailer(true);
$mail->isSMTP();
$mail->Host="smtp.gmail.com";
$mail->Port=587;
$mail->SMTPSecure="tls";
$mail->SMTPAuth=true;
$mail->Username="somemail9245#gmail.com";
$mail->Password="passwords";
$mail->SetFrom("shophana2337#gmail.com");
$mail->addAddress($row['email']);
$mail->IsHTML(true);
$mail->Subject="Invoice Details";
$mail->Body=$html;
$mail->SMTPOptions=array('ssl'=>array(
'verify_peer'=>false,
'verify_peer_name'=>false,
'allow_self_signed'=>false
));
if($mail->send()){
return true;
}else{
return false;
}
}
i am to trying export a report data / html to excel / csv using tableExport with this code logic
$('#tblRpt').tableExport({ type: 'csv', escape: 'false', tableName:
'yourTableName' });
this code works in other reports which has simple html structure. The report which i am trying to export has nested tables in it. The exported file loses its html formatting. I don't have choice to use third party plugin because of project optimization issues.
Please suggest me a way to solve this issue without using any third party tool/plugin, Thank you
This is the html of my report which i am trying to export.
<tbody><tr>
<td colspan="2" class="no-border-right"><strong></strong></td>
<td align="right" valign="top" class="no-border-left">10/01/2020
10:53</td>
</tr>
<tr>
<td width="20%" class="no-border-right"><strong>User: Practical Head
Office</strong></td>
<td width="60%" align="center" class="no-border-left no-border-right">
<strong id="MidRptHeading">
M.I.D Report - Curent Fleet Only
</strong> (01 Dec 2019 - 31 Dec 2019)
</td>
<td width="20%" align="right" valign="top" class="no-border-left">
<strong></strong></td>
</tr>
<tr>
<td colspan="3" style="padding: 0; border:0;">
<table width="100%" style="border-collapse:collapse; border-spacing: 0; margin: 0 auto;" cellspacing="0" cellpadding="0">
<thead>
<tr>
<th valign="top"><strong>Reg no</strong></th>
<th valign="top"><strong>Insure type</strong></th>
<th valign="top"><strong>Make</strong></th>
<th valign="top"><strong>Model type</strong></th>
<th valign="top"><strong>Derivative</strong></th>
<th align="center" valign="top" style="text-align: center;"><strong>Engine size</strong></th>
<th align="center" valign="top" style="text-align: center;"><strong>Date of Registration</strong></th>
<th align="center" valign="top" style="text-align: center;"><strong>Value</strong></th>
<th valign="top" style="text-align: center;"><strong>Seats</strong></th>
<th align="right" valign="top" style="text-align: center;"><strong>Gross vcl wt</strong></th>
<th align="center" valign="top" style="text-align: center;"><strong>Vehicle on date</strong></th>
<th align="center" valign="top" style="text-align: center;"><strong>Vehicle off date</strong></th>
<th valign="top"><strong>Location</strong></th>
<th valign="top" style="text-align: center;"><strong>VIN number</strong></th>
</tr>
</thead>
<tbody id="tblMidVehiclesList">
<tr>
<td valign="top">KP69WBZ</td>
<td valign="top">Car</td>
<td valign="top">NISSAN</td>
<td valign="top">QASHQAI</td>
<td valign="top">QASHQAI DIG-T TEKNA</td>
<td align="center" valign="top">1332</td>
<td align="center" valign="top">20/09/2019</td>
<td align="center" valign="top"></td>
<td align="center" valign="top">4</td>
<td align="center" valign="top">0</td>
<td align="center" valign="top">05/12/2019</td>
<td align="center" valign="top">
</td>
<td valign="top">CHIPPENHAM</td>
<td align="center" valign="top">SJNFFAJ11U2647316</td>
</tr>
<tr>
<td valign="top">BJ69JXU</td>
<td valign="top">Car</td>
<td valign="top">PEUGEOT</td>
<td valign="top">Peugeot GTL 1.2 GT LINE</td>
<td valign="top">308 GT LINE PURETECH S/S</td>
<td align="center" valign="top">1200</td>
<td align="center" valign="top">27/09/2019</td>
<td align="center" valign="top"></td>
<td align="center" valign="top">4</td>
<td align="center" valign="top">0</td>
<td align="center" valign="top">10/12/2019</td>
<td align="center" valign="top">
</td>
<td valign="top">CHIPPENHAM</td>
<td align="center" valign="top">VF3LPHNSJKS346785</td>
</tr>
<tr>
<td valign="top">KN69TGX</td>
<td valign="top">Van up to 3.5T</td>
<td valign="top">VOLKSWAGEN</td>
<td valign="top">Transporter T30</td>
<td valign="top">TRANSPORTER T30 H-LINE TD</td>
<td align="center" valign="top">1968</td>
<td align="center" valign="top">30/09/2019</td>
<td align="center" valign="top"></td>
<td align="center" valign="top">2</td>
<td align="center" valign="top">3000</td>
<td align="center" valign="top">12/12/2019</td>
<td align="center" valign="top">
</td>
<td valign="top">CHIPPENHAM</td>
<td align="center" valign="top">WV1ZZZ7HZKH180620</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td colspan="3" style="border-bottom: 1px solid #000; padding: 0;"></td>
</tr>
<tr>
<td colspan="3" style="padding: 0; border:0; vertical-align:top;">
<table width="100%" style="border-collapse:collapse; border-spacing: 0; margin: 0 auto;" cellspacing="0" cellpadding="0">
<tbody><tr>
<td width="40%" style="padding: 0; border:0; vertical-align:top;">
<table width="100%" class="table-summary">
<tbody><tr>
<td width="17%" valign="top"> </td>
<td width="14%" align="center" valign="top"><strong>At Start of Month</strong></td>
<td width="8%" align="center" valign="top"><strong>Current</strong></td>
</tr>
<tr>
<td valign="top"><strong>Owned vehicles</strong></td>
<td align="center" valign="top">21</td>
<td align="center" valign="top">0</td>
</tr>
<tr>
<td valign="top"><strong>Leased vehicles</strong></td>
<td align="center" valign="top">38</td>
<td align="center" valign="top">3</td>
</tr>
<tr>
<td valign="top"><strong>Temporary vehicles</strong></td>
<td align="center" valign="top">0</td>
<td align="center" valign="top">0</td>
</tr>
<tr>
<td valign="top"><strong>Total fleet</strong></td>
<td align="center" valign="top"><strong>59</strong></td>
<td align="center" valign="top"><strong>3</strong></td>
</tr>
</tbody></table>
</td>
<td width="30%" style="padding: 0; border:0; vertical-align:top;">
<table width="100%" class="table-summary">
<tbody><tr>
<td align="left" valign="top"> </td>
<td align="center" valign="top"><strong>Current fleet</strong></td>
<td valign="top"> </td>
</tr>
<tr>
<td align="left" valign="top"> <strong>Car</strong></td>
<td align="center" valign="top">2</td>
<td valign="top"> </td>
</tr>
<tr>
<td align="left" valign="top"> <strong>Minibus</strong></td>
<td align="center" valign="top">0</td>
<td valign="top"> </td>
</tr>
<tr>
<td align="left" valign="top"> <strong>Motorhome up to 3.5T</strong></td>
<td align="center" valign="top">0</td>
<td valign="top"> </td>
</tr>
<tr>
<td align="left" valign="top"> <strong>Motorhome 3.5T-7.5T</strong></td>
<td align="center" valign="top">0</td>
<td valign="top"> </td>
</tr>
<tr>
<td align="left" valign="top"> <strong>MPV</strong></td>
<td align="center" valign="top">0</td>
<td valign="top"> </td>
</tr>
<tr>
<td align="left" valign="top"> <strong>Van up to 3.5T</strong></td>
<td align="center" valign="top">1</td>
<td valign="top"> </td>
</tr>
<tr>
<td align="left" valign="top"> <strong>Van 3.5T-7.5T</strong></td>
<td align="center" valign="top">0</td>
<td valign="top"> </td>
</tr>
<tr>
<td align="left" valign="top"> <strong>HP Cars</strong></td>
<td align="center" valign="top">0</td>
<td valign="top"> </td>
</tr>
</tbody></table>
</td>
<td width="30%" style="padding: 0; border:0; vertical-align:top;"></td>
</tr>
</tbody></table>
</td>
</tr>
<tr>
<td colspan="3" valign="top" align="center" style="border-top: 1px solid #000;"><strong>End of report</strong></td>
</tr>
</tbody>
I'm finally at the point where my email looks great in all clients... Except for Gmail Mobile. Specifically, it's pushing my nav bar links and footer bar links (Which are tables) to the left, instead of centring them.
Any advice?
Nav bar code:
<td style="font-family:'Helvetica',
monospace;font-size:12px;line-height:15px;color:#FFFFFF;text-align:center;text-decoration:none;white-space:nowrap;"><a moz-do-not-send="true" href="https://partofthekult.com/collections/tees" target="_blank" style="font-family:'Helvetica',
monospace;font-size:15px;line-height:15px;color:#FFFFFF;text-align:center;text-decoration:none;white-space:nowrap;">TEES
</a></td>
<td width="0">
<table align="center" border="0" cellpadding="0" cellspacing="0" width="20">
<tbody>
<tr>
</tr>
</tbody>
</table>
</td>
<td style="font-family:'Helvetica',
monospace;font-size:12px;line-height:15px;color:#FFFFFF;text-align:center;text-decoration:none;white-space:nowrap;"><a moz-do-not-send="true" href="https://partofthekult.com/collections/tanks" target="_blank" style="font-family:'Helvetica',
monospace;font-size:15px;line-height:15px;color:#FFFFFF;text-align:center;text-decoration:none;white-space:nowrap;">TANKS</a></td>
<td class="ecxh" width="0">
<table align="center" border="0" cellpadding="0" cellspacing="0" width="20">
<tbody>
<tr>
</tr>
</tbody>
</table>
</td>
<td class="ecxh" style="font-family:'Helvetica',
monospace;font-size:12px;line-height:15px;color:#FFFFFF;text-align:center;text-decoration:none;white-space:nowrap;"><a moz-do-not-send="true" href="https://partofthekult.com/collections/accessories" target="_blank" style="font-family:'Helvetica',
monospace;font-size:15px;line-height:15px;color:#FFFFFF;text-align:center;text-decoration:none;white-space:nowrap;">ACCESSORIES
</a></td>
<td class="ecxh" width="0">
<table align="center" border="0" cellpadding="0" cellspacing="0" width="20">
<tbody>
<tr>
</tr>
</tbody>
</table>
</td>
<td class="ecxh" style="font-family:'Helvetica',
monospace;font-size:12px;line-height:15px;color:#FFFFFF;text-align:center;text-decoration:none;white-space:nowrap;"><a moz-do-not-send="true" href="https://partofthekult.com/collections/sale" target="_blank" style="font-family:'Helvetica',
monospace;font-size:15px;line-height:15px;color:#FFFFFF;text-align:center;text-decoration:none;white-space:nowrap;">SALE</a></td>
<td class="ecxh" width="0">
<table align="center" border="0" cellpadding="0" cellspacing="0" width="20">
<tbody>
<tr>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
And my footer is similar to this, except using image links instead of text.
After looking at your code, it seems that you have used align="center" attribute to center the table. I would suggest to use CSS instead of HTML attributes. You can use margin:0 auto; CSS property to center an table within it's parent container.
Please see below updated code:
<table class="ecxw320" align="center" border="0" cellpadding="0" cellspacing="0" width="640">
<tbody>
<tr bgcolor="#000000">
<td height="50">
<!--Use margin:0 auto; to center a table within it's parent container-->
<table style="margin:0 auto;" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td>
<table align="center" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td width="20">
</td>
</tr>
</tbody>
</table>
</td>
<td style="font-family:'Helvetica',
monospace;font-size:12px;line-height:15px;color:#FFFFFF;text-align:center;text-decoration:none;display:block;white-space:nowrap;"><a moz-do-not-send="true" href="https://partofthekult.com/collections/tees" target="_blank" style="font-family:'Helvetica',
monospace;font-size:15px;line-height:15px;color:#FFFFFF;text-align:center;text-decoration:none;display:block;white-space:nowrap;">TEES
</a>
</td>
<td width="0">
<table align="center" border="0" cellpadding="0" cellspacing="0" width="20">
<tbody>
<tr>
</tr>
</tbody>
</table>
</td>
<td style="font-family:'Helvetica',
monospace;font-size:12px;line-height:15px;color:#FFFFFF;text-align:center;text-decoration:none;display:block;white-space:nowrap;"><a moz-do-not-send="true" href="https://partofthekult.com/collections/tanks" target="_blank" style="font-family:'Helvetica',
monospace;font-size:15px;line-height:15px;color:#FFFFFF;text-align:center;text-decoration:none;display:block;white-space:nowrap;">TANKS</a>
</td>
<td class="ecxh" width="0">
<table align="center" border="0" cellpadding="0" cellspacing="0" width="20">
<tbody>
<tr>
</tr>
</tbody>
</table>
</td>
<td class="ecxh" style="font-family:'Helvetica',
monospace;font-size:12px;line-height:15px;color:#FFFFFF;text-align:center;text-decoration:none;display:block;white-space:nowrap;"><a moz-do-not-send="true" href="https://partofthekult.com/collections/accessories" target="_blank" style="font-family:'Helvetica',
monospace;font-size:15px;line-height:15px;color:#FFFFFF;text-align:center;text-decoration:none;display:block;white-space:nowrap;">ACCESSORIES
</a>
</td>
<td class="ecxh" width="0">
<table align="center" border="0" cellpadding="0" cellspacing="0" width="20">
<tbody>
<tr>
</tr>
</tbody>
</table>
</td>
<td class="ecxh" style="font-family:'Helvetica',
monospace;font-size:12px;line-height:15px;color:#FFFFFF;text-align:center;text-decoration:none;display:block;white-space:nowrap;"><a moz-do-not-send="true" href="https://partofthekult.com/collections/sale" target="_blank" style="font-family:'Helvetica',
monospace;font-size:15px;line-height:15px;color:#FFFFFF;text-align:center;text-decoration:none;display:block;white-space:nowrap;">SALE</a>
</td>
<td class="ecxh" width="0">
<table align="center" border="0" cellpadding="0" cellspacing="0" width="20">
<tbody>
<tr>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
I have the following code that calls OBJECT adds +10 then sorts the result,
at the moment it is returning:
b b b 20
c c c 13
a a a 11
d d d 10
This is a correct sort and the values are correct. However I need the full table to be included in those results as per code snippet.
<div class="box">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="25%" bgcolor="#CCFF99">b</td>
<td width="25%" bgcolor="#CCFF99">b</td>
<td width="25%" bgcolor="#CCFF99">b</td>
<td width="25%" bgcolor="#CCFF99">20</td>
</tr>
</table>
</div>
<div class="box">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="25%" bgcolor="#FF9933">c</td>
<td width="25%" bgcolor="#FF9933">c</td>
<td width="25%" bgcolor="#FF9933">c</td>
<td width="25%" bgcolor="#FF9933">13</td>
</tr>
</table>
</div>
<div class="box">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="25%" bgcolor="#99CC66">a</td>
<td width="25%" bgcolor="#99CC66">a</td>
<td width="25%" bgcolor="#99CC66">a</td>
<td width="25%" bgcolor="#99CC66">11</td>
</tr>
</table>
</div>
<div class="box">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="25%" bgcolor="#CCCC99">d</td>
<td width="25%" bgcolor="#CCCC99">d</td>
<td width="25%" bgcolor="#CCCC99">d</td>
<td width="25%" bgcolor="#CCCC99">10</td>
</tr>
</table>
</div>
How do I get the full HTML table data returned with the SORT array? Perhaps there is a better way of doing it?
<!--HTML ===-->
<div id="containerSort">
<!--HTML-->
<div class="box">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="25%" bgcolor="#99CC66">a</td>
<td width="25%" bgcolor="#99CC66">a</td>
<td width="25%" bgcolor="#99CC66">a</td>
<td width="25%" bgcolor="#99CC66"><object>001</object></td>
</tr>
</table>
</div>
<div class="box">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="25%" bgcolor="#CCFF99">b</td>
<td width="25%" bgcolor="#CCFF99">b</td>
<td width="25%" bgcolor="#CCFF99">b</td>
<td width="25%" bgcolor="#CCFF99"><object>10</object></td>
</tr>
</table>
</div>
<div class="box">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="25%" bgcolor="#FF9933">c</td>
<td width="25%" bgcolor="#FF9933">c</td>
<td width="25%" bgcolor="#FF9933">c</td>
<td width="25%" bgcolor="#FF9933"><object>03</object></td>
</tr>
</table>
</div>
<div class="box">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="25%" bgcolor="#CCCC99">d</td>
<td width="25%" bgcolor="#CCCC99">d</td>
<td width="25%" bgcolor="#CCCC99">d</td>
<td width="25%" bgcolor="#CCCC99"><object>0</object></td>
</tr>
</table>
</div>
<div id="increase"></div>
</div>
<script type='text/javascript'>
$(document).ready(function() {
$("#increase").trigger("click");
});
// Assign function as eventListener
$("#increase").click(computeAndUpdateValue);
// Wrapper function
function computeAndUpdateValue() {
var valArr = getValues();
valArr = addNumber(valArr);
valArr = sortValues(valArr);
createAndRenderHTML(valArr, "#containerSort");
}
function getValues() {
var returnArray = [];
$("div.box").each(function(id, el) {
returnArray.push($(el));
});
return returnArray;
}
function addNumber(arr) {
return arr.map(function(item) {
var $object = $(item).find("object");
$object.text(parseInt($object.text(), 10) + 10);
return item;
});
}
function sortValues(arr) {
return arr.sort(function(a, b) {
a = parseInt($(a).find("object").text(), 10);
b = parseInt($(b).find("object").text(), 10);
return a > b ? -1 : a < b ? 1 : 0;
});
}
function createAndRenderHTML(arr, el) {
var _html = arr.map(function(item) {
return "<div class='box'> <object>" + item.text() + "</object></div>"
});
$(el).empty().append(_html);
}
</script>
I was able to solve this entire problem with the following simple code
$(window).on('load', function() {
$(document).ready(function() {
tinysort("div",{order:"desc"});
} );
})
The Tinysort model automatically assumes 10 is greater than 2
HATS off to tinysort:)
I was wondering if I can pass the tables on the webpage to the body of the email. I was wondering if this was possible and if so point me in the right direction
My Button:
<input type="submit" value="SUBMIT EMAIL TO: GNOC" <a
href="mailto:myemail#whatever.com">
Table:
<table cellpadding="4" cellspacing="0"
border="0" width="100%">
<tr>
<td
id="_invisibleIfEmpty" name="_invisibleIfEmpty"
colspan="3" valign="top" width="100%">
<WebPartPages:WebPartZone runat="server"
Title="loc:Header" ID="Header"
FrameType="TitleBarOnly"/> </td>
</tr>
<tr>
<td
id="_invisibleIfEmpty" name="_invisibleIfEmpty"
rowspan="4" valign="top" height="100%">
<WebPartPages:WebPartZone runat="server"
Title="loc:LeftColumn" ID="LeftColumn"
FrameType="TitleBarOnly"/> </td>
<td
id="_invisibleIfEmpty" name="_invisibleIfEmpty"
valign="top" height="100%"> <WebPartPages:WebPartZone
runat="server" Title="loc:Row1" ID="Row1"
FrameType="TitleBarOnly" Orientation="Horizontal"/>
</td>
<td
id="_invisibleIfEmpty" name="_invisibleIfEmpty"
rowspan="4" valign="top" height="100%">
<WebPartPages:WebPartZone runat="server"
Title="loc:RightColumn" ID="RightColumn"
FrameType="TitleBarOnly"/> </td>
</tr>
<tr>
<td
id="_invisibleIfEmpty" name="_invisibleIfEmpty"
valign="top" height="100%"> <WebPartPages:WebPartZone
runat="server" Title="loc:Row2" ID="Row2"
FrameType="TitleBarOnly" Orientation="Horizontal"/>
</td>
</tr>
<tr>
<td
id="_invisibleIfEmpty" name="_invisibleIfEmpty"
valign="top" height="100%"> <WebPartPages:WebPartZone
runat="server" Title="loc:Row3" ID="Row3"
FrameType="TitleBarOnly" Orientation="Horizontal"/>
</td>
</tr>
<tr>
<td
id="_invisibleIfEmpty" name="_invisibleIfEmpty"
valign="top" height="100%"> <WebPartPages:WebPartZone
runat="server" Title="loc:Row4" ID="Row4"
FrameType="TitleBarOnly" Orientation="Horizontal"/>
</td>
</tr>
<tr>
<td
id="_invisibleIfEmpty" name="_invisibleIfEmpty"
colspan="3" valign="top" width="100%">
<WebPartPages:WebPartZone runat="server"
Title="loc:Footer" ID="Footer"
FrameType="TitleBarOnly"/> </td>
</tr>
<script
language="javascript">if(typeof
(MSOLayout_MakeInvisibleIfEmpty) == "function")
{MSOLayout_MakeInvisibleIfEmpty();}</script>
</table>
Goal: Import table from webform into email body
It isn't possible.
However, why don't you use an ajax call to send all the information in a table as if it were a form? On the separate php document you call to, use PHP's mail functionality (http://php.net/manual/en/function.mail.php)
for example:
<form type="POST">
<table> <!-- This is your table -->
<tr>
<td>
Username
</td>
<td>
<input type="text" name="username" value="whateveruserentered" />
</td>
</tr>
<table>
So in the ajax method, you'd send username through. Then in the php page you called you'd say
<table>
<tr>
<td>
Username
</td>
<td>
<?php echo $_POST['username']; ?>
</td>
</tr>
<table>
So you're recreating the table.
Put all of that in the body of the mail property, and off it goes. Fully fledged table just like on the original page.
In order to send the templated information you want to?