TD not aligned correctly - html-table

Im having a little trouble trying to align this table, also the padding is not working. Im trying to make the textbox start in the same position as the checkbox but below it, also im trying to add padding to the first tr by doing it to the td but its not working.
<table>
<tr>
<td>
<input type="checkbox" Style="margin-left: 165px; padding-bottom: 50px;">
</td>
<td>
<label Style="padding-bottom: 50px;">Label for Checkbox</label>
</td>
</tr>
<tr>
<td>
<label Width="163px">#Another Label:</label>
</td>
<td>
<input type="textbox" MaxLength="20" Width="163px">
</td>
</tr>
</table>
Here is the fiddle --> https://jsfiddle.net/u5vu5mn6/

Related

Adding breaks in table td

<div id="headerAgentInfoDetailsPhone">
<table>
<tr>
<td>vendor:</td><td><input type="text" /></td>
<td>vendorgroup:</td><td><input type="text" /></td>
<td>account:</td><td><input type="text" /></td>
</tr>
I have code as above. Now I want a break function after the second td. For example as follows:
<div id="headerAgentInfoDetailsPhone">
<table>
<tr>
<td>vendor:</td><td><input type="text" /></td><br />
<td>vendorgroup:</td><td><input type="text" /></td><br />
<td>account:</td><td><input type="text" /></td>
</tr>
I tried to add td:n-thchild(even):after {content: \A; white-space: pre;
text-align: justify;} but its not working. The whole content is getting displayed in a single row.
A <br /> between a </td> and a <td> cannot do anything. What do you want to do by "adding a break" ?
If you want to show each info on a separated line, you have to write a new <tr> :
<table>
<tr>
<td>vendor:</td><td><input type="text" /></td>
</tr>
<tr>
<td>vendorgroup:</td><td><input type="text" /></td>
</tr>
<tr>
<td>account:</td><td><input type="text" /></td>
</tr>
</table>
It will draw a 3 lines table, with 2 cells in each line.
Yes, <tr is table row, and <td is table data. See http://www.w3schools.com/html/html_tables.asp for explanation. In a table you can't break the row with <br>, so if you use </tr> and <tr> to start a new table row instead it will work better.

POST request not working in form

I'm trying to submit some form using POST method. Here is par of form:
<form action="interlopers.php" mehod="post" id = "interlopersForm" name="interlopersForm" onsubmit="return validateInterlopersForm()">
<table border="0">
<tr>
<td> <label for="ast_num" > Ast. num </label> </td>
<td> <input type="text" name="ast_num" id = "ast_num"
value="<?php if(isset($_REQUEST['ast_num'])) { echo htmlentities ($_REQUEST['ast_num']); } ?>"
size="6"> </td>
</tr>
<tr>
<td><label for="cut_off"> Cut-off </label></td>
<td><input type="text" name="cut_off" id="cut_off" size="6" ></td>
</tr>
<tr>
<td><label for="data"> Data </label></td>
<td><input type ="checkbox" name="data" id = "dataSDSS" value="SDSS" checked> SDSS <br>
<input type ="checkbox" name="data" id="dataWISE" value="WISE" checked > WISE <br>
<input type ="checkbox" name="data" id = "dataSp" value="Sp" checked> Taxonomy</td>
</tr>
<tr>
<td> <label for="isFinalStep"> Just interlopers? </label> </td>
<td> <input type = "checkbox" name="isFinalStep" id = "isFinalStep"> </td>
</tr>
<tr> <input type="hidden" name="submitted" value="1"> </tr>
<tr>
<td colspan="2" align="center"> <input type="submit" value="Calculate" > </td>
</tr>
</table>
</form>
But, instead of getting POST request im getting GET request. I'm using apache server and php5 on Ubuntu. I tried this on local-server and on remote host, but still GET instead of POST.
Change mehod="post" to method="post".
You wrote wrong.

click on a checkbox selenium java

Hi, I want to b able to click on a check box based on a value. Below is the html of the same:
<tbody>
<tr>
<th>Record Type</th>
<th style="text-align:center">Has Access?</th>
<th style="text-align:center">Can Create?</th>
<th style="text-align:center">Can Read All Records?</th>
</tr>
<tr>
<td>
<input id="ORMW.S2.0.Object Type" class="readOnlyField" type="text" value="Account" maxlength="255" size="25" name="ORMW.S2.0.Object Type" readonly="readonly"/>
</td>
<td align="center">
<input id="ORMW.S2.0.Has Access_VP123456" type="checkbox" onclick="cbValue(this,'ORMW.S2.0.Has\x20Access');" style="margin-left:0px;margin-top:1px;height:10px;width:10px;vertical-align:middle"/>
<input id="ORMW.S2.0.Has Access" type="hidden" value="Y" tabindex="-1" name="ORMW.S2.0.Has Access"/>
</td>
<td align="center">
<td align="center">
I want to click on checkbox based on the value account here.
Next query will search element by #value='Account' then traverse up to the first tr and then search your checkbox:
//input[#type='text' and #value='Account']/ancestor::tr[1]//input[#type='checkbox']
you can also try this:
//input[#type='checkbox' and preceding-sibling::input[#type='text' and #value='Account']]

Clicking on checkbox based on tables column value - IE Webdriver Selenium

Clicking on checkbox based on tables column value using Xpath. Below is the html
<table id="tblHotels">
<TBODY>
<TR>
<TH align="left">
<INPUT checkbox="" id="chkNSelectAll name=chkNSelectAll type="/>
</TH>
<TH align="left" title="Hotel">Hotel</TH>
<TH title=" align=left">
<SPAN id="spnExpandBtn">
<IMG/>
</SPAN>
</TH>
<TH align="left" title="Hotel">Hotel</TH>
<TH align="left" title="Reg Date">Reg Date</TH>
<TH align="left" title="Room Type">Room Type</TH>
<TH align="left" title="Location">Location</TH>
<TH align="left" title="Room Number">Room Number</TH>
</TR>
<TR>
<TD colSpan="11">
<IMG src=" ../NoExpiry/images/uaimBSpacer.gif"/>
</TD>
</TR>
<TR>
<TD>
<INPUT id="chkNSelect" name="chkNSelect" type="checkbox" value="on"/>
</TD>
<TD customHiddenText="">MATHEW Joe</TD>
<TD/>
<TD customHiddenText="">
<SPAN>Affray (
<STRONG/>Kim Lee)
</SPAN>
</TD>
<TD class="regDate customHiddenText=">10/01/2014</TD>
<TD customHiddenText="">1HE</TD>
<TD customHiddenText="">South West </TD>
<TD id="tdChildroom name=" tdChildroom=""/>
<INPUT id="hidYID" name="hidYID" type="hidden" value="409">
<INPUT id="hidYD" name="hidYD" type="hidden">
<INPUT id="hidYDID" name="hidYDID" type="hidden" value="1015389"/>
</INPUT>
</INPUT>
</TR>
<TR>
<TD>
<INPUT id="chkNSelect" name="chkNSelect" type="checkbox" value="on"/>
</TD>
<TD customHiddenText="">MATHEW Penny</TD>
<TD/>
<TD customHiddenText="">
<SPAN>Affray (
<STRONG/>Jim Lee)
</SPAN>
</TD>
<TD class="regDate customHiddenText=">10/01/2014</TD>
<TD customHiddenText="">1HE</TD>
<TD customHiddenText="">South West </TD>
<TD id="tdChildroom name=" tdChildroom=""/>
<INPUT id="hidYID" name="hidYID" type="hidden" value="409">
<INPUT id="hidYD" name="hidYD" type="hidden">
<INPUT id="hidYDID" name="hidYDID" type="hidden" value="1015389"/>
</INPUT>
</INPUT>
</TR>
</TBODY>
</table>
here is what i am trying and this always clicks the first checkbox??
Driver.FindElementByXPath("//td[contains(text(),'MATHEW Penny')]/preceding::td/input[#name='chkNSelect']").Click()
If i try to just find the column with the text it can find it not why it cannot find the preceding check box and jumps to first rows check box??
Driver.FindElementByXPath("//td[contains(text(),'MATHEW Penny')]
my requirement is to select the first checkbox (do something eg:add it to another table) uncheck it then check the 2nd checkbox (do something eg:add it to another table).
Use for MATHEW Penny:
//td[contains(text(),'Penny')]/preceding-sibling::td/input[#name='chkNSelect']
Use for MATHEW Joe:
//td[contains(text(),'Joe')]/preceding-sibling::td/input[#name='chkNSelect']
Its selecting all input elements with name as chkNSelect which comes before td with text as MATHEW Penny.
Use
//td[contains(text(),'MATHEW Penny')]/preceding::td/input[last()][#name='chkNSelect']
to select only first such input
You could try:
first targeting the tr
containing the td with the text node you want (using a predicate)
and then going to an input within a td in that table row
So that translates to:
Driver.FindElementByXPath("//tr[td[contains(text(),'MATHEW Penny')]]/td/input[#name='chkNSelect']")
Breakdown:
//tr[
td[
contains(text(),'MATHEW Penny')
]
]
/td/input[#name='chkNSelect']

Finding Edit link in the driver.PageSource and Click using Selenium Webdriver (C#)

I am trying to find the text and if the text is found then click the Edit link which is in the td tag.... but when you look at the page source I dont see how to determine any recommendation or suggestions to achieve?
for an example:
in my page html source (see below) in the td i have text called Title1 once I found the text then I want to find a way to click on the Edit link (which is a hyperlink)
here is what i have done so far
//here is my code
IWebDriver driver = new OpenQA.Selenium.IE.InternetExplorerDriver();
string url ="http://site.com";
driver.Navigate().GoToUrl(url);
string pagesource = driver.PageSource;
//html page source:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head id="ctl00_PageHead">
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Employee </title>
<body id="ctl00_PageBody">
<form name="aspnetForm" method="post" action="login.aspx" id="aspnetForm" class="container">
<div>
</div>
<div>
</div>
<table class="global-table" cellpadding="0" cellspacing="0">
<tr class="body">
<td>
<div id="body">
<div id="body-inner">
<h1>
Employee Information</h1>
<div id="ctl00_ContentPlaceHolder1_Control1_pnlList" style="width: 100%;">
<div class='filter'>
Language:
<select name="ctl00$ContentPlaceHolder1$Control1$ddlLanguage" onchange="javascript:setTimeout('__doPostBack(\'ctl00$ContentPlaceHolder1$Control1$ddlLanguage\',\'\')', 0)"
id="ctl00_ContentPlaceHolder1_Control1_ddlLanguage">
<option selected="selected" value="1">English</option>
</select></div>
<div>
<table class="gv" cellspacing="0" border="0" id="ctl00_ContentPlaceHolder1_Control1_gv"
style="border-collapse: collapse;">
<tr class="gridHeader">
<td colspan="8">
<div style="float: left; margin-left: 7px; margin-top: 0px;">
<div style="float: left;">
<input type="image" name="ctl00$ContentPlaceHolder1$Control1$gv$ctl01$ibtnFirst"
id="ctl00_ContentPlaceHolder1_Control1_gv_ctl01_ibtnFirst" disabled="disabled"
title="First Page" src="../App_Themes/Default/images/grid_page_first.png" style="border-width: 0px;
opacity: 0.4; filter: alpha(opacity=40); cursor: default;" />
<input type="image" name="ctl00$ContentPlaceHolder1$Control1$gv$ctl01$ibtnPrev" id="ctl00_ContentPlaceHolder1_Control1_gv_ctl01_ibtnPrev"
disabled="disabled" title="Previous Page" src="../App_Themes/Default/images/grid_page_prev.png"
style="border-width: 0px; opacity: 0.4; filter: alpha(opacity=40); cursor: default;" />
</div>
<div style="float: left; padding: 3px 5px 0px 5px;">
<div class="pagerNumber">
Page 1 of 34
</div>
</div>
<div style="float: left;">
<input type="image" name="ctl00$ContentPlaceHolder1$Control1$gv$ctl01$ibtnNext" id="ctl00_ContentPlaceHolder1_Control1_gv_ctl01_ibtnNext"
title="Next Page" src="../App_Themes/Default/images/grid_page_next.png" style="border-width: 0px;" />
<input type="image" name="ctl00$ContentPlaceHolder1$Control1$gv$ctl01$ibtnLast" id="ctl00_ContentPlaceHolder1_Control1_gv_ctl01_ibtnLast"
title="Last Page" src="../App_Themes/Default/images/grid_page_last.png" style="border-width: 0px;" />
</div>
</div>
<div style="float: left; margin: 0px 6px 0px 20px;">
Page Size
<select name="ctl00$ContentPlaceHolder1$Control1$gv$ctl01$ddlPageSize" onchange="javascript:setTimeout('__doPostBack(\'ctl00$ContentPlaceHolder1$Control1$gv$ctl01$ddlPageSize\',\'\')', 0)"
id="ctl00_ContentPlaceHolder1_Control1_gv_ctl01_ddlPageSize">
<option selected="selected" value="10">10</option>
<option value="20">20</option>
<option value="50">50</option>
<option value="100">100</option>
</select>
</div>
<div id="ctl00_ContentPlaceHolder1_Control1_gv_ctl01_RecordCount" style="float: right;
padding-right: 10px; margin-top: 3px;">
<b>10</b> Items Found</div>
</td>
</tr>
<tr class="header">
<th class=" nolink" scope="col">
</th>
<th scope="col">
<a href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$Control1$gv','Sort$Phone')">
Phone</a>
</th>
<th class=" sorted-desc" scope="col">
<a href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$Control1$gv','Sort$Title')">
Title</a>
</th>
<th scope="col">
<a href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$Control1$gv','Sort$SubTitle')">
SubTitle</a>
</th>
<th scope="col">
<a href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$Control1$gv','Sort$Names')">
Names</a>
</th>
<th scope="col">
<a href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$Control1$gv','Sort$Names')">
Enames</a>
</th>
<th scope="col">
<a href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$Control1$gv','Sort$Active')">
Active</a>
</th>
<th scope="col">
<a href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$Control1$gv','Sort$DateTime')">
DateTime</a>
</th>
</tr>
<tr class="item">
<td align="center">
<a href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$Control1$gv','Select$0')">
Edit</a>
</td>
<td align="center" style="width: 15px;">
</td>
<td>
Title1
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
8/23/2011
</td>
</tr>
<tr class="altItem">
<td align="center">
<a href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$Control1$gv','Select$1')">
Edit</a>
</td>
<td align="center" style="width: 15px;">
</td>
<td>
1
</td>
<td>
1
</td>
<td>
Employee
</td>
<td>
</td>
<td>
</td>
<td>
7/31/2014
</td>
</tr>
<tr class="item">
<td align="center">
<a href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$Control1$gv','Select$2')">
Edit</a>
</td>
<td align="center" style="width: 15px;">
</td>
<td>
111
</td>
<td>
111
</td>
<td>
Employer
</td>
<td>
</td>
<td>
</td>
<td>
7/31/2013
</td>
</tr>
<tr class="altItem">
<td align="center">
<a href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$Control1$gv','Select$3')">
Edit</a>
</td>
<td align="center" style="width: 15px;">
</td>
<td>
123
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
8/23/2011
</td>
</tr>
<tr class="item">
<td align="center">
<a href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$Control1$gv','Select$4')">
Edit</a>
</td>
<td align="center" style="width: 15px;">
</td>
<td>
2
</td>
<td>
2
</td>
<td>
Employer
</td>
<td>
</td>
<td>
</td>
<td>
7/31/2012
</td>
</tr>
<tr class="altItem">
<td align="center">
<a href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$Control1$gv','Select$5')">
Edit</a>
</td>
<td align="center" style="width: 15px;">
</td>
<td>
3
</td>
<td>
3
</td>
<td>
Employer
</td>
<td>
</td>
<td>
</td>
<td>
7/31/2012
</td>
</tr>
<tr class="item">
<td align="center">
<a href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$Control1$gv','Select$6')">
Edit</a>
</td>
<td align="center" style="width: 15px;">
</td>
<td>
a
</td>
<td>
a
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
7/20/2012
</td>
</tr>
<tr class="altItem">
<td align="center">
<a href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$Control1$gv','Select$7')">
Edit</a>
</td>
<td align="center" style="width: 15px;">
</td>
<td>
Day
</td>
<td>
</td>
<td>
Customer
</td>
<td>
</td>
<td>
</td>
<td>
3/2/2013
</td>
</tr>
<tr class="item">
<td align="center">
<a href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$Control1$gv','Select$8')">
Edit</a>
</td>
<td align="center" style="width: 15px;">
</td>
<td>
a1
</td>
<td>
a1
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
7/24/20/14
</td>
</tr>
<tr class="altItem">
<td align="center">
<a href="javascript:__doPostBack('ctl00$ContentPlaceHolder1$Control1$gv','Select$9')">
Edit</a>
</td>
<td align="center" style="width: 15px;">
</td>
<td>
A1
</td>
<td>
A1
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td>
7/30/2012
</td>
</tr>
</table>
</div>
</div>
</div>
</div>
</td>
</tr>
<tr class="footer">
<td>
</td>
</tr>
</table>
</form>
</body>
</html>
Why wouldn't the following work?
// Assumes "driver" is a valid object implementing IWebDriver
IWebElement table = driver.FindElement(By.ClassName("gv"));
IWebElement element = table.FindElement(By.XPath(".//td[contains(., 'Title1')]/..//a"));
In essence, this says, "Starting at the table with the class name "gv", find the <td> element whose text contains 'Title1', navigate to it's parent (which should be the <tr> element), then find the first <a> descendent element."