What I need to find is the "Edit" link that coincides with the "Test Group" link.
I have tried:
//td[contains(text(),'Edit')]/..//a[text()='Test Group']
//td[contains(., "Edit")]/preceding-sibling::a
//*[contains(text(),'Edit')]//tr/td[contains(., 'Test Group')])[3]
Source HTML:
<td>
<a class="hovsml" onclick="editGroup(5522); return false;" href="#">Edit</a>
</td>
<td>
<a class="hovsml" onclick="removeGroup(5522,'Test Group'); return false;" href="#">Delete</a>
</td>
<td>
<img id="groupText5522" width="16" vspace="0" border="0" hspace="0" height="16" onmouseout="hideGroupList('groupInfoDiv5522');" onmouseover="showGroupList('groupText5522','groupInfoDiv5522');" src="img/group_info.gif" style="position: relative;"/>
<a class="hovsml" title="Test Group" onclick="popup('GroupInfo.php?id=5522','groupinfo',300,430); return false;" href="#">Test Group</a>
</td>
The most robust approach is probably to start with all <tr>s that contain a "Test Group" link and find the "Edit" link from there:
tr[.//a[text()='Test Group']]//a[text()='Edit']
(Assuming all <td>s have a <tr> parent.)
Start from the "Test Group" link, go up two levels, then look for the "Edit" link:
//a[text()='Test Group']/../../td/a[text()='Edit']
Related
I am using ERB templating in Sinatra to display a table of data.
How can I use jQuery to get table data of a specific row when I click the EDIT button without having to assign specific class or ids to each <td> or <tr>?
<table>
<tr>
<td>question</td>
<td>answer</td>
<td>edit</td>
</tr>
<tr>
<td>What is a carrot?</td>
<td>A vegetable</td>
<td>
<a id="editbutton" class="btn btn-default" onclick="editModal()" data-toggle="modal" data-target="#basicModal4" aria-hidden="true" name="btn" data-modal-type="confirm"><em class="fa fa-pencil"></em></a>
</td>
</tr>
<tr>
<td>What does HTML stand for?</td>
<td>Hyper Text Markup Language</td>
<td>
<a id="editbutton" class="btn btn-default" onclick="editModal()" data-toggle="modal" data-target="#basicModal4" aria-hidden="true" name="btn" data-modal-type="confirm"><em class="fa fa-pencil"></em></a>
</td>
</tr>
</table>
UPDATE:
I have managed to get the following to get the value in the nearest <td>
$('.editbutton').click(function(e) {
var output = $(this).closest('tr').find('.as').text();
alert(output);
});
but I need values from both table data cells in that row. Any ideas?
Jquery .closest() , check API https://api.jquery.com/closest/
Hey i am trying to select the parent of the parent element i suppose. I have a table in which i am trying to use Watir/Ruby to select the edit or delete button from the same row but in a different coloumn, example.
Name 1 -> Edit Icon -> Delete Icon
Name 2 -> Edit Icon -> Delete Icon
Example code below:
<html>
<body>
<table class="table-responsive">
<thead>...</thead>
<tbody>
<tr>
<td class="col-name">Name 1</td>
<td>
<a class="edit" href="/">
<span class="icon-edit"></span>
</a>
<a class="delete" href="/">
<span class="icon-delete"></span>
</a>
</td>
</tr>
<tr>
<td class="col-name">Name 2</td>
<td>
<a class="edit" href="/">
<span class="icon-edit"></span>
</a>
<a class="delete" href="/">
<span class="icon-delete"></span>
</a>
</td>
</tr>
<tr>
...
</tr>
<tbody>
</table>
</body>
</html>
So far i have tried this but it is not working. I get an error TypeError: can't convert Hash into an exact number
table = #browser.table.when_present(:class => "table-responsive")
iconrow = table.span(:text => "Name 1").parent
if iconrow.a(:class => "edit").exists?
iconrow.a(:class => "edit").click
end
There might be a couple issues with the code:
* The :class locator is being applied to when_present rather than the table itself.
* The element with "Name 1" is a td rather than a span.
Try:
table = #browser.table(:class => "table-responsive").when_present
iconrow = table.td(:text => "Name 1").parent
if iconrow.a(:class => "edit").exists?
iconrow.a(:class => "edit").click
end
<tr>
<td>AAA</td>
<td>
<a class="btn" role="button"> </a>
<td>
</tr>
<tr>
<td>bbb</td>
<td>
<a class="btn" role="button"> </a>
<td>
</tr>
How to select a if tr contains <td>AAA</td>. Perfect if I can do it with XPath. But maybe another way in WebDriver
You can do this using Xpath.
//td[text() = 'AAA']/following-sibling::td/a
This will get find a td which has the text AAA. Then it will select the following td sibling and get the a from this td.
I want to make a newsletter template for mailchimp & campaign monitor ..
I know in newsletters we have to use table layout and inline styles and i have already done that in my template but i wonder if there are any specific rules i must follow to make my template valid for mailchimp & campaign monitor ?? or just use the following html for the both ??
This is my code :
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<table width="100%" align="center" bgcolor="#ebebeb">
<tbody>
<tr>
<td>
<table width="600px" align="center" bgcolor="#FFFFFF">
<tbody>
<tr align="center">
<td style="padding:9px 18px;color:#696969;font-family:Arial,'Helvetica Neue',Helvetica,sans-serif;font-size:13px;text-align:left;line-height:150%">
<p><span style="font-weight: bold;">Hello friend,</span><br /><br />
Why you make everything from scratch?! Now you can find thousands of full source code on the internet and save your time. Here you can find some awesome of them for your upcoming apps! </p>
<p align="left" style="font-weight: bold;">Don't re-invent the wheel!</p>
<p align="right" style="font-weight: bold;"><span align="left">- NileWorx</span></p>
</td>
</tr>
</tbody>
</table>
<br />
<table width="600px" align="center" bgcolor="#FFFFFF">
<tbody>
<tr align="center">
<td style="padding:9px 14px;color:#696969;font-family:Arial,'Helvetica Neue',Helvetica,sans-serif;font-size:13px;text-align:left;line-height:150%">
<a style="text-decoration:none;" href="" target="_blank"><img src="" /></a>
<div align="left">
<a style="text-decoration:none;" href="" target="_blank"><h3 style="color:#49ADBD;font-size:12pt">Football Logo Quiz - Android</h3></a>
<p style="text-align: justify;">Football Logo Quiz is a worldwide game. +10,000,000 are playing logo quiz games and we filled it with many good features. It has an admin panel and use AdMob to monetize it. It is easy to customize!</p>
<div style="font-family:Arial,'Helvetica Neue',Helvetica,sans-serif;font-weight: bold;display:inline-block;width: auto; background-color: green;padding: 8px;color: #FFFFFF"><a style="color:#FFFFFF;text-decoration:none;" href="" target="_blank">VIEW FULL</a></div>
</div>
</td>
</tr>
<tr><td><hr /></td></tr>
<tr align="center">
<td align="center">
<table align="left" width="280" >
<tbody>
<tr>
<td style="padding-top:9px;padding-left:10px;padding-bottom:9px;padding-right:0;color:#696969;font-family:Helvetica;font-size:13px;line-height:150%;text-align:left">
<a style="text-decoration:none;" href="" target="_blank"><img src="" /></a>
<a style="text-decoration:none;" href="" target="_blank"><h3 style="color:#49ADBD;font-size:12pt">Success Quotes - Android & iOS</h3></a>
<p style="text-align: justify;">SuccessQuotes is an android motivational application. It has SQLiteDatabase with 1000 success quotes for more than 180 authors and sharing features.</p>
</td>
</tr>
</tbody>
</table>
<table align="right" width="280">
<tbody>
<tr>
<td style="padding-top:9px;padding-right:10px;padding-bottom:9px;padding-left:0;color:#696969;font-family:Helvetica;font-size:13px;line-height:150%;text-align:left">
<a style="text-decoration:none;" href="" target="_blank"><img src="" /></a>
<a style="text-decoration:none;" href="" target="_blank"><h3 style="color:#49ADBD;font-size:12pt">Facebook Feeds Notifier - Android</h3></a>
<p style="text-align: justify;">Never miss an important post!! .. keep in touch with your favorite facebook pages without opening the facebook application..</p>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<br />
<table width="600px" align="center" bgcolor="#FFFFFF">
<tbody>
<tr>
<td style="padding-top:9px;padding-right:10px;padding-bottom:9px;padding-left:0;color:#696969;font-family:Helvetica;font-size:13px;line-height:150%;">
<p style="text-align: right;" align="right">
Codecanyon: <a style="text-decoration: none;color:#49ADBD" target="_blank" href="http://codecanyon.net/user/NileWorx/portfolio?ref=NileWorx">Our portfolio</a>
<br />
Skype: <span style="text-decoration: none;color:#49ADBD">nileworx.support</span>
<br />
E-mail: <a style="text-decoration: none;color:#49ADBD" href="mailto:nileworx.contact#gmail.com">nileworx.contact#gmail.com</a>
</p>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</body>
</html>
ahmed, this is Ros from Campaign Monitor here. One thing is writing HTML code, however if you want to use our email editor, you will need to use our template language to create editable areas in your template. Note that our template language differs from MailChimp's, so you will need to make two versions of your template.
If you're stuck on the code, I would highly recommend you create and export a template from our email builder.
Thanks, eng.ahmed - let us know if you have any other questions!
after playing around this morning, i've found that there's this default chunk of html code in the amazon webstore which will add a toolbar on top of the page. the html looks like below:
<td id="wba_logo_bg">
<table class="logo" border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody><tr><td align="left"></td>
<td class="wba_account" style="padding: 5px;" align="right" valign="top">
<table border="0" cellpadding="0" cellspacing="0">
<form action="#" id="searchForm" method="get" name="searchForm"></form>
<tbody><tr><td class="wba_account_link">
<a xmlns:xhtml="http://www.w3.org/1999/xhtml" class="myAccountNav" href="#" onclick="return false;">home</a></td>
<td class="myAccountDots"></td>
<td class="wba_account_link"><a class="myAccountNav" href="#" onclick="return false;">view cart</a></td>
<td class="myAccountDots"></td><td class="wba_account_link"><a class="myAccountNav" href="#" onclick="return false;">my account</a></td>
<td class="myAccountDots"></td><td class="wba_account_link"><a class="myAccountNav" href="#" onclick="return false;">order status</a></td>
<td><img src="pageEditor_files/1_pixel.gif" hspace="7"></td>
<td><input name="keyword" tabindex="1" type="text"></td>
<td><img alt="Search" class="wba_search_btn" onclick="return false;" onkeyup="if (13==event.keyCode) searchForm.submit();"
src="pageEditor_files/btn_search.gif" style="cursor: pointer;" tabindex="2" title="Search" hspace="3">
</td></tr></tbody>
</table>
</td></tr></tbody>
</table>
</td>
and thus far i was able to use prototype to find those with the class name of wba_account_link and hide them via the codes below:
function hideAmazonToolbar()
{
$("#wba_logo_bg").hide();
}//end function
but what i really want to do is preferably to hide the whole tbody instead, but with my limited prototype skills, i don't really know how to do this. can anybody point me to the right resources on how to get this done?
EDIT
Went higher up and apparently there's a td with an id, and solve it using prototype hide function! man, i love javascript framework :)
You want the up function. I think this should do it.
document.getElementsByClassName('wba_account_link').up('tbody');