Merge HTML table rows in SQL server - sql

I am generating the following string in SQL Server which consists of pay data of employees, no.of rows keep varying according to the pay components each employee gets. Even pay types are not fixed for any two given employees. Almost all the pay components vary according to the employees experience, position, qualification, etc.,
<table style="color: #000066; border-collapse: collapse; font-family: Arial,sans-serif; width: 100%; font-size: 10.0pt;" border="1" cellpadding="5">
<tbody>
<tr style="text-align: center;">
<th>Pay Type</th>
<th>Pay Desc</th>
<th>Pay Freq</th>
<th>Currency</th>
<th>Amount</th>
<th>Per Annum</th>
</tr>
<tr>
<td>Salary</td>
<td>Basic Salary</td>
<td style="text-align: center;">Monthly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">23750.00</td>
<td style="text-align: center;">285000.00</td>
</tr>
<tr>
<td>Salary</td>
<td>House Rent Allowance</td>
<td style="text-align: center;">Monthly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">11875.00</td>
<td style="text-align: center;">142500.00</td>
</tr>
<tr>
<td>Salary</td>
<td>Conveyance Allowance</td>
<td style="text-align: center;">Monthly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">1600.00</td>
<td style="text-align: center;">19200.00</td>
</tr>
<tr>
<td>Salary</td>
<td>Education Allowance</td>
<td style="text-align: center;">Monthly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">200.00</td>
<td style="text-align: center;">2400.00</td>
</tr>
<tr>
<td>Salary</td>
<td>Fp Bal</td>
<td style="text-align: center;">Monthly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">34550.00</td>
<td style="text-align: center;">414600.00</td>
</tr>
<tr>
<td>Salary</td>
<td>Ecal</td>
<td style="text-align: center;">Yearly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">144000.00</td>
<td style="text-align: center;">144000.00</td>
</tr>
<tr>
<td>Salary</td>
<td>Retention Pay</td>
<td style="text-align: center;">Yearly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">105000.00</td>
<td style="text-align: center;">105000.00</td>
</tr>
<tr>
<td>Reimbursements</td>
<td>Medical Reimb. Normal</td>
<td style="text-align: center;">Monthly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">25000.00</td>
<td style="text-align: center;">300000.00</td>
</tr>
<tr>
<td>Reimbursements</td>
<td>Phone, Datacard, Landline</td>
<td style="text-align: center;">Monthly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">2800.00</td>
<td style="text-align: center;">33600.00</td>
</tr>
<tr>
<td>Reimbursements</td>
<td>Phone</td>
<td style="text-align: center;">Yearly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">1000.00</td>
<td style="text-align: center;">1000.00</td>
</tr>
<tr>
<td>Reimbursements</td>
<td>Datacard</td>
<td style="text-align: center;">Yearly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">833.00</td>
<td style="text-align: center;">833.00</td>
</tr>
<tr>
<td>Reimbursements</td>
<td>Spectacle</td>
<td style="text-align: center;">Yearly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">2500.00</td>
<td style="text-align: center;">2500.00</td>
</tr>
<tr>
<td>Benefits</td>
<td>Car Valuation (New Car Scheme)</td>
<td style="text-align: center;">Monthly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">3500.00</td>
<td style="text-align: center;">42000.00</td>
</tr>
<tr>
<td>Benefits</td>
<td>Leave Travel Allowance</td>
<td style="text-align: center;">Monthly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">2084.00</td>
<td style="text-align: center;">25008.00</td>
</tr>
<tr>
<td>Benefits</td>
<td>Bonus</td>
<td style="text-align: center;">Monthly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">12584.00</td>
<td style="text-align: center;">151008.00</td>
</tr>
<tr>
<td>Benefits</td>
<td>Esop</td>
<td style="text-align: center;">Yearly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">282716.00</td>
<td style="text-align: center;">282716.00</td>
</tr>
<tr>
<td>Retirement Benefits</td>
<td>Employee Pf</td>
<td style="text-align: center;">Monthly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">2850.00</td>
<td style="text-align: center;">34200.00</td>
</tr>
<tr>
<td>Retirement Benefits</td>
<td>Employee Gratuity</td>
<td style="text-align: center;">Monthly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">1000.00</td>
<td style="text-align: center;">12000.00</td>
</tr>
</tbody>
</table>
If you observe column one, most of the data is repetative. Is it possible to merge the rows of first column depending on the data it contains in sql server. So that the string looks like below.
<table style="color: #000066; border-collapse: collapse; font-family: Arial,sans-serif; width: 100%; font-size: 10.0pt;" border="1" cellpadding="5">
<tbody>
<tr style="text-align: center;">
<th>Pay Type</th>
<th>Pay Desc</th>
<th>Pay Freq</th>
<th>Currency</th>
<th>Amount</th>
<th>Per Annum</th>
</tr>
<tr>
<td rowspan="7">Salary</td>
<td>Basic Salary</td>
<td style="text-align: center;">Monthly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">23750.00</td>
<td style="text-align: center;">285000.00</td>
</tr>
<tr>
<td>House Rent Allowance</td>
<td style="text-align: center;">Monthly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">11875.00</td>
<td style="text-align: center;">142500.00</td>
</tr>
<tr>
<td>Conveyance Allowance</td>
<td style="text-align: center;">Monthly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">1600.00</td>
<td style="text-align: center;">19200.00</td>
</tr>
<tr>
<td>Education Allowance</td>
<td style="text-align: center;">Monthly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">200.00</td>
<td style="text-align: center;">2400.00</td>
</tr>
<tr>
<td>Fp Bal</td>
<td style="text-align: center;">Monthly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">34550.00</td>
<td style="text-align: center;">414600.00</td>
</tr>
<tr>
<td>Ecal</td>
<td style="text-align: center;">Yearly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">144000.00</td>
<td style="text-align: center;">144000.00</td>
</tr>
<tr>
<td>Retention Pay</td>
<td style="text-align: center;">Yearly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">105000.00</td>
<td style="text-align: center;">105000.00</td>
</tr>
<tr>
<td rowspan="5">Reimbursements</td>
<td>Medical Reimb. Normal</td>
<td style="text-align: center;">Monthly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">25000.00</td>
<td style="text-align: center;">300000.00</td>
</tr>
<tr>
<td>Phone, Datacard, Landline</td>
<td style="text-align: center;">Monthly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">2800.00</td>
<td style="text-align: center;">33600.00</td>
</tr>
<tr>
<td>Phone</td>
<td style="text-align: center;">Yearly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">1000.00</td>
<td style="text-align: center;">1000.00</td>
</tr>
<tr>
<td>Datacard</td>
<td style="text-align: center;">Yearly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">833.00</td>
<td style="text-align: center;">833.00</td>
</tr>
<tr>
<td>Spectacle</td>
<td style="text-align: center;">Yearly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">2500.00</td>
<td style="text-align: center;">2500.00</td>
</tr>
<tr>
<td rowspan="4">Benefits</td>
<td>Car Valuation (New Car Scheme)</td>
<td style="text-align: center;">Monthly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">3500.00</td>
<td style="text-align: center;">42000.00</td>
</tr>
<tr>
<td>Leave Travel Allowance</td>
<td style="text-align: center;">Monthly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">2084.00</td>
<td style="text-align: center;">25008.00</td>
</tr>
<tr>
<td>Bonus</td>
<td style="text-align: center;">Monthly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">12584.00</td>
<td style="text-align: center;">151008.00</td>
</tr>
<tr>
<td>Esop</td>
<td style="text-align: center;">Yearly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">282716.00</td>
<td style="text-align: center;">282716.00</td>
</tr>
<tr>
<td rowspan="2">Retirement Benefits</td>
<td>Employee Pf</td>
<td style="text-align: center;">Monthly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">2850.00</td>
<td style="text-align: center;">34200.00</td>
</tr>
<tr>
<td>Employee Gratuity</td>
<td style="text-align: center;">Monthly</td>
<td style="text-align: center;">INR</td>
<td style="text-align: center;">1000.00</td>
<td style="text-align: center;">12000.00</td>
</tr>
</tbody>
</table>
Following is my query to generate this string.
set #tabSalary=N'<table cellpadding="5" style="color:#000066;border-collapse: collapse;font-family:Arial,sans-serif;width:100%;font-size: 10.0pt;" border="1">'
+ N'<tr style="text-align:center;"><th>Pay Type</th><th>Pay Desc</th><th>Pay Freq</th><th>Currency</th><th>Amount</th>
<th>Per Annum</th>
</tr>'
+ CAST((
SELECT isnull(p.PayTypeDesc,'') AS td,
isnull(dbo.ProperCase(p.PayDesc),'') AS td,
isnull(p.PayFrequency,'') as tda,
isnull(p.Currency,'') as tda,
isnull(cast(p.PerMonth as varchar),'') as tda,
isnull(cast(p.PerAnnum as varchar),'') as tda
FROM #saltmp p
order by p.sort1, p.sort2
FOR XML RAW('tr'), ELEMENTS
) AS NVARCHAR(MAX))
+ N'</table>'
SET #tabSalary = REPLACE(#tabSalary, '<tda>', '<td style="text-align:center;">')
SET #tabSalary = REPLACE(#tabSalary, '</tda>', '</td>')

Below is my solution. Quite complex, though.
A few notes before that:
i would personally not recommend this kind of processings within SQL Server, because it is not optimized for them
this should be done on your front-end, because of maintainability and flexibility of your HTML, CSS, event-handlig, etc...
nevertheless, such queries are a challenge from SQL perspective, so hopefully this may help you aнд others as well
DECLARE
#rowsHtml NVARCHAR(MAX), #htmlASxml XML;
;WITH CTE AS (
SELECT
DENSE_RANK() OVER (ORDER BY p.PayTypeDesc) AS PayTypeDesc_GroupSortingIndex,
ROW_NUMBER() OVER (PARTITION BY p.PayTypeDesc ORDER BY p.sort1, p.sort2) AS PayTypeDesc_GroupInnerSortingIndex,
COUNT(*) OVER (PARTITION BY p.PayTypeDesc) AS PayTypeDesc_Count,
ISNULL(p.PayTypeDesc,'') AS PayTypeDesc,
ISNULL(p.PayDesc,'') AS PayDesc,
ISNULL(p.PayFrequency,'') AS PayFrequency,
ISNULL(p.Currency,'') AS Currency,
ISNULL(CAST(p.PerMonth AS VARCHAR(10)),'') AS PerMonth,
ISNULL(CAST(p.PerAnnum AS VARCHAR(10)),'') AS PerAnnum
FROM #saltmp p
)
SELECT #htmlASxml = (
SELECT
PayTypeDesc_Count AS 'PayTypeDesc/#rowspan',
PayTypeDesc,
PayDesc,
PayFrequency,
Currency,
PerMonth,
PerAnnum
FROM (
SELECT
PayTypeDesc_Count,
PayTypeDesc,
PayDesc,
PayFrequency,
Currency,
PerMonth,
PerAnnum,
PayTypeDesc_GroupSortingIndex,
PayTypeDesc_GroupInnerSortingIndex
FROM CTE
WHERE PayTypeDesc_GroupInnerSortingIndex = 1
UNION ALL
SELECT
null,null,
PayDesc,
PayFrequency,
Currency,
PerMonth,
PerAnnum,
PayTypeDesc_GroupSortingIndex,
PayTypeDesc_GroupInnerSortingIndex
FROM CTE
WHERE PayTypeDesc_GroupInnerSortingIndex != 1
) as D
ORDER BY PayTypeDesc_GroupSortingIndex, PayTypeDesc_GroupInnerSortingIndex
FOR XML PATH('tr')
);
Here is a screenshot of the replacements you should do. (I don't know why but some of my single-quoted strings are not showing up when I post the answer)
Plеase, don't forget to put your vote and accept this answer if appropriate.
Thanks!

Related

Interior column padding mailchimp

I am in the process of making a custom html template but cannot wok out how to make interior padding on a column (the ones with the 'call to action' button)
I have been trying to insert a small td with a width before the content but it breaks the column.
The code I have is below (apologies for the volume) but I can't work out exactly where to cut it back without breaking it.
<table width="650" style="background-color: #077ec3" border="0" cellspacing="0" cellpadding="0" align="center" class="wrapper" mc:repeatable mc:variant="2 Column With IMAGE + TITLE + DESC + READ MORE" style="table-layout:fixed;">
<tr>
<td height="15" class="fix_height"> </td>
</tr>
<tr>
<td class="pad_side" >
<table width="310" border="0" cellspacing="0" cellpadding="0" align="left" class="wrapper">
<tr>
<td align="center" valign="top">
<table width="310" border="0" cellspacing="0" cellpadding="0" align="center" class="wrapper">
<tr>
<td width="45" class="hide"> </td>
<td valign="top">
<table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td align="center" valign="top"><img src="https://gallery.mailchimp.com/330985abb260e1ae49eb607dd/images/a3bb236f-8b0a-4003-93de-6f40d964612c.jpg" width="265" height="130" alt="img_265X130" style="display:block;border:none; max-width:265px;" mc:edit="product1_img">
</td>
</tr>
<tr>
<td height="25" class="fix_height" style="background-color: #ffffff;"> </td>
</tr>
<tr style="background-color: #ffffff">
<td class="black" align="left" valign="top" style="font-family:Arial, sans-serif;font-size:18px;line-height:24px;color:#333333;" mc:edit="product1_title">Blog Post</td>
</tr>
<tr>
<td height="8" style="line-height:1px;font-size:1px; background-color: #ffffff;"> </td>
</tr>
<tr>
<td class="grey" align="left" valign="top" style="font-family:Arial, sans-serif;background-color: #ffffff;font-size:13px;line-height:20px;color:#333333;" mc:edit="product1_description">Text block 1</td>
</tr>
<tr>
<td height="15" style="line-height:1px;font-size:1px; background-color: #ffffff"> </td>
</tr>
<tr mc:hideable>
<td height="43" style="background-color: #ffffff" valign="top">
<table border="0" align="left" cellpadding="0" cellspacing="0" class="wrapper">
<tr>
<td>
<table border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="43" class="button_2" align="center" style="background-color:#ffffff; font-family:Arial, sans-serif;font-size:16px;line-height:18px;color:#ffffff;border-radius:3px;" bgcolor="#ffffff" mc:edit="btn_10">
   Call to action   
</td>
</tr>
<tr>
<td height="25" style="line-height:1px;font-size:1px; background-color: #ffffff"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="40" style="line-height:1px;font-size:1px;" class="hide"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
<table width="310" border="0" cellspacing="0" cellpadding="0" align="right" class="wrapper">
<tr>
<td align="center" valign="top">
<table width="310" border="0" cellspacing="0" cellpadding="0" align="center" class="wrapper">
<tr>
<td align="left" valign="top">
<table width="100%" border="0" cellspacing="0" cellpadding="0" align="center">
<tr>
<td align="center" valign="top" class="pad_top"><img src="https://gallery.mailchimp.com/330985abb260e1ae49eb607dd/images/a3bb236f-8b0a-4003-93de-6f40d964612c.jpg" width="265" height="130" alt="img_265X130" style="display:block;border:none; max-width:265px;" mc:edit="product2_img">
</td>
</tr>
<tr>
<td height="25" class="fix_height" style="background-color: #ffffff;"> </td>
</tr>
<tr>
<td class="black" align="left" valign="top" style="font-family:Arial, sans-serif;font-size:18px;line-height:24px;color:#333333;background-color: white;" mc:edit="product2_title">Blog Post 2</td>
</tr>
<tr style="background-color: white;">
<td height="8" style="line-height:1px;font-size:1px;" > </td>
</tr>
<tr>
<td class="grey" align="left" valign="top" style="font-family:Arial, sans-serif;font-size:13px;line-height:20px;color:#333333;background-color:#ffffff;" mc:edit="product2_description">Text block 2</td>
</tr>
<tr style="background-color: white;">
<td height="15" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr mc:hideable>
<td height="43" style="background-color: #ffffff" valign="top">
<table border="0" align="left" cellpadding="0" cellspacing="0" class="wrapper">
<tr>
<td>
<table border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="43" class="button_2" align="center" style="background-color:#ffffff; font-family:Arial, sans-serif;font-size:16px;line-height:18px;color:#ffffff;border-radius:3px;" bgcolor="#ffffff" mc:edit="btn_10">
   Call to action   
</td>
</tr>
<tr>
<td height="25" style="line-height:1px;font-size:1px; background-color: #ffffff"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td width="45" class="hide"> </td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
Add padding-left to the td elements containing the text and CTA you want space.
Padding is well supported, so will work fine.

Selenium C# List Elements between Xpaths

I was wondering if this is capable/ anyone has an example.
The webpage I'm accessing has a very structured layout and uses comments to start and finish sections.
In each section their is always a opening comment, a closing comments and a <h3></h3> and then only sometimes a <table></table>
If I know the Xpaths where a section starts and where it finishes is there a way to loop this range?
HTML
<!-- Asset Allocation -->
<h3 style="border-top: 1px solid #CCCCCC; margin-top: 20px;">Asset Allocation</h3>
<p class="fundreportsubheading">% as at 31 Aug 2017</p>
<table class="table2 tablefundreport noth">
<tbody><tr class="N_Qodd">
<td style="text-align: left;">Domestic Equity</td>
<td>4.181</td>
</tr>
<tr class="N_Qeven">
<td style="text-align: left;">International Equity</td>
<td>95.494</td>
</tr>
<tr class="N_Qodd">
<td style="text-align: left;">Listed Property</td>
<td>0.000</td>
</tr>
<tr class="N_Qeven">
<td style="text-align: left;">Unlisted Property</td>
<td>0.000</td>
</tr>
<tr class="N_Qodd">
<td style="text-align: left;">Domestic Fixed Interest</td>
<td>0.000</td>
</tr>
<tr class="N_Qeven">
<td style="text-align: left;">International Fixed Interest</td>
<td>0.000</td>
</tr>
<tr class="N_Qodd">
<td style="text-align: left;">Cash</td>
<td>0.325</td>
</tr>
<tr class="N_Qeven">
<td style="text-align: left; border-bottom: none;">Other</td>
<td style="border-bottom: none;">0.000</td>
</tr>
</tbody></table>
<!-- /Asset Allocation -->
Sample comment Xpaths
//*[#id="maincontent"]/div[2]/div[3]/comment()[3]
//*[#id="maincontent"]/div[2]/div[3]/comment()[4]

make a table responsive

the following code is a table, i tried to make it responsive with bootstrap 3,
i added class="table" to table tag, but it didnt work.
what should i do? what is wrong?
<div class="tab3_main" id="cs1">
<table width="770" border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<th height="50" colspan="3" align="left" scope="col">Camera</th>
</tr>
<tr> </tr>
<tr>
<td width="135" align="left" class="td">Image Sensor:</td>
<td width="15" align="left" class="td1">|</td>
<td align="left" class="td2">1/3" Progressive Scan CMOS</td>
</tr>
<tr> </tr>
<tr>
<td width="135" align="left" class="td">Min. Illumination:</td>
<td width="15" align="left" class="td1">|</td>
<td align="left" class="td2">0.01Lux #(F1.2,AGC ON), 0.028Lux #(F2.0,AGC ON), 0 Lux with IR</td>
</tr>
<tr> </tr>
<tr>
<td width="135" align="left" class="td">Shutter time:</td>
<td width="15" align="left" class="td1">|</td>
<td align="left" class="td2">1/3 s ~ 1/10,000 s</td>
</tr>
<tr> </tr>
<tr>
<td width="135" align="left" class="td">Slow shutter:</td>
<td width="15" align="left" class="td1">|</td>
<td align="left" class="td2">Support</td>
</tr>
<tr> </tr>
</tbody>
</table>
You should wrap your ".table" in ".table-responsive"
<div class="table-responsive">
<table class="table">
...
</table>
</div>
to make a table responsive in bootstrap 3.

Selecting An Element In Web Browser VB

<td class="data-display-field" width="20%" valign="top">
<table class="printtotal" cellspacing="0" cellpadding="0" width="100%" ><tbody>
<tr class="list-row">
<td class="data-display-field" width="60%" style="font-weight: bold" align="center" colspan="2">Order Totals</td>
</tr>
<tr class="list-row">
<td class="data-display-field" width="60%" align="right" >Items total:</td>
<td class="data-display-field" width="40%" align="right" >
£323.36</td>
</tr>
<tr class="list-row">
<td class="data-display-field" width="60%" align="right" >Delivery total:</td>
<td class="data-display-field" width="40%" align="right" >
£7.00</td>
</tr>
<tr class="list-row">
<td class="data-display-field" style="color: #CC0000" width="60%" align="right" >Refund(s) total:</td>
<td class="data-display-field" style="color: #CC0000" width="40%" align="right" >(
£330.36)</td>
</tr>
How would I be able to make my web browser in VB select the money amount after "Refund(s) total:", I don't know how to do it as they all have the same class
you may use a unique id for elements like
<td id="id001"></td>
and with jquery you nay select id like this
$('#id001')
any reason that you are not using id?

Selenium RC - Having difficulty with Selenium IDE to find a table cell

I hope someone here can help me. Im using selenium to test a page that has an image which when click displays a calendar. I can get as far as clicking the image using
browser.click("//center/table/tbody/tr/td[1]/a/img")
I got the above path by using the Selenium IDE. The problem is once i click the above image the Selenium IDE does not record what i have clicked after the calendar is shown.
Here is the code for the image button
<INPUT size='8' CLASS="field-date" TYPE="text" NAME="endQtrDate" VALUE="01/10/2004" ID="endQtrDate" onBlur="this.value=validateFieldValue(this.value,'date_error','endQtrDate',this.form)" onFocus="this.select()" TITLE="Enter date in format dd/mm/yyyy" />
<IMG ALIGN="absmiddle" ALT="Press to show calendar picker" NAME="calendarButton" SRC="../images/buttons/small/calendar.gif" onClick="return showCalendar('endQtrDate', 'dd/MM/yyyy');" />
Unfortunately i cant see the code for the calendar after i click it. The only way i can see it is using the mozilla plugin "Firebug". I managed to get the div layer of which the calendar is displayed.
<div class="calendar"
style="position: absolute; display: none; left: 234px; top: 416px;">
<table cellspacing="0" cellpadding="0">
<thead>
<tr>
<td colspan="1" class="button">-</td>
<td colspan="6" class="title" style="cursor: move;">October,
2004</td>
<td colspan="1" class="button">×</td>
</tr>
<tr class="headrow">
<td colspan="1" class="button">«</td>
<td colspan="1" class="button">‹</td>
<td colspan="4" class="button">Today</td>
<td colspan="1" class="button">›</td>
<td colspan="1" class="button">»</td>
</tr>
<tr class="daynames">
<td class="name wn">wk</td>
<td class="day name">Mon</td>
<td class="day name">Tue</td>
<td class="day name">Wed</td>
<td class="day name">Thu</td>
<td class="day name">Fri</td>
<td class="name day weekend">Sat</td>
<td class="name day weekend">Sun</td>
</tr>
</thead>
<tbody>
<tr class="daysrow">
<td class="day wn">40</td>
<td class="day"> </td>
<td class="day"> </td>
<td class="day"> </td>
<td class="day"> </td>
<td class="day">1</td>
<td class="day weekend">2</td>
<td class="day weekend">3</td>
</tr>
<tr class="daysrow">
<td class="day wn">41</td>
<td class="day">4</td>
<td class="day">5</td>
<td class="day">6</td>
<td class="day">7</td>
<td class="day">8</td>
<td class="day weekend">9</td>
<td class="day weekend">10</td>
</tr>
<tr class="daysrow">
<td class="day wn">42</td>
<td class="day">11</td>
<td class="day">12</td>
<td class="day">13</td>
<td class="day">14</td>
<td class="selected day">15</td>
<td class="day weekend">16</td>
<td class="day weekend">17</td>
</tr>
<tr class="daysrow">
<td class="day wn">43</td>
<td class="day">18</td>
<td class="day">19</td>
<td class="day">20</td>
<td class="day">21</td>
<td class="day">22</td>
<td class="day weekend">23</td>
<td class="day weekend">24</td>
</tr>
<tr class="daysrow">
<td class="day wn">44</td>
<td class="day">25</td>
<td class="day">26</td>
<td class="day">27</td>
<td class="day">28</td>
<td class="day">29</td>
<td class="day weekend">30</td>
<td class="day weekend">31</td>
</tr>
<tr class="emptyrow">
<td class="day wn">36</td>
<td class="day">30</td>
<td class="day">31</td>
<td class="day"> </td>
<td class="day"> </td>
<td class="day"> </td>
<td class="day"> </td>
<td class="day"> </td>
</tr>
</tbody>
<tfoot>
<tr class="footrow">
<td colspan="8" class="ttip" style="cursor: move;">Select date</td>
</tr>
</tfoot>
</table>
<div class="combo" style="display: none;">
<div class="label">Jan</div>
<div class="label">Feb</div>
<div class="label">Mar</div>
<div class="label">Apr</div>
<div class="label">May</div>
<div class="label">Jun</div>
<div class="label">Jul</div>
<div class="label">Aug</div>
<div class="label">Sep</div>
<div class="label">Oct</div>
<div class="label">Nov</div>
<div class="label">Dec</div>
</div>
<div class="combo" style="display: none;">
<div class="label"></div>
<div class="label"></div>
<div class="label"></div>
<div class="label"></div>
<div class="label"></div>
<div class="label"></div>
<div class="label"></div>
<div class="label"></div>
<div class="label"></div>
<div class="label"></div>
<div class="label"></div>
<div class="label"></div>
</div>
</div>
If you look carefully you will see table cells for dates from 1 to 30th. How can i access these values using Selenium? I can use the IDE as it doesnt record anything when the calendar pops up.
The firebug has an option to display the xpath of any tag. I tried it on one of the td tags and it says this is the xpath.
/html/body/div/table/thead/tr[2]/td[3]
Can i use the above path to determine its value then click on it using selenium?
Thanks
To click on the image you can use click | calendarButton and that should load it up for you.
From there you will then need to click on items I would then use firebug to see the other items on the page.
Edit from extra info:
What you need to do then is use xpath=//td[#class="day" and text()="14"] for xpath or for css use css=td.day:contains('14')
The css route will be a lot quicker in browsers like Internet Explorer