Develop Reference

Can't Change Select Item in Table with Selenium Python

I'm working with a really outdated site that's giving me issues. What I'm trying to do is select the "Judgement/Lien Search" tab as seen on: page
The issue is that there are no identifiers. No name, ID, etc.
<table border="0" bgcolor="#ededed" cellpadding="8" cellspacing="0">
<tbody>
<tr>
<td width="33%" bgcolor="#ededed" nowrap=""><b><font size="+1"><u>Case Search</u></font></b></td>
<td width="33%" bgcolor="#cccccc" nowrap=""><b><font size="+1">Judgment/Lien Search</font></b></td>
<td width="33%" bgcolor="#cccccc" nowrap=""><font size="+1"><b>Property/Lis Pendens Search</b></font></td>
</tr>
</tbody>
I've tried using xpath, css selector, and even just executing the script. I've been using ChroPath to get the correct info. When <b><font size="+1">Judgment/Lien Search</font></b> is selected ChroPath gives me these options:
Rel XPath: //td[2]//a[1]
Abs Xpath: /html[1]/body[1]/table[1]/tbody[1]/tr[1]/td[2]/a[1]
CSS Selector: table:nth-child(5) tbody:nth-child(1) tr:nth-child(1) td:nth-child(2) > a:nth-child(1)
None of which have actually worked when using driver.find options
When I try to just execute the javascript driver.execute_script("javascript:submitJudgementSearch();") I get error: "selenium.common.exceptions.JavascriptException: Message: javascript error: submitJudgementSearch is not defined".
Any ideas on other ways to select it? Or am I looking at something wrong? This bump in the road really has me stumped. Thanks!

What about using Attribute Starts With Selector ?
Since your anchors seems to have unique href values this could work as a selector for the anchor itself. From there you could move up the dom to the parent if the <td> is indeed what you need.
$('a[href^="http://example.com/external/link"]').click(function() {});

You could use document.querySelector to get the job done potentially, refer to the snippet below. I was able to select that element using document.querySelector
document.querySelector('td a b').style.color = "red";
<table border="0" bgcolor="#ededed" cellpadding="8" cellspacing="0">
<tbody>
<tr>
<td width="33%" bgcolor="#ededed" nowrap=""><b><font size="+1"><u>Case Search</u></font></b></td>
<td width="33%" bgcolor="#cccccc" nowrap=""><b><font size="+1">Judgment/Lien Search</font></b></td>
<td width="33%" bgcolor="#cccccc" nowrap="">
<a href="javascript:submitPropertySearch();" target="_self">
<font size="+1"><b>Property/Lis Pendens Search</b></font>
</a>
</td>
</tr>
</tbody>
Theres another example here
And the Mozilla docs

Cycling through CSS Post classes in Tumblr

I am trying to style my {block:Photo} styles in Tumblr, so that each time a photo is posted, it will cycle through a selection of, for instance, 5 slightly different classes for displaying the picture.
An example of such can be found here (where each photo table has a unique max-width property): http://www.nontemporary.com/
The code I've come up with so far, having made ample use of the Chrome inspector is thus:
{block:Posts}
{block:Photo}
<li class="post photo">
<table width="100%" align="left" valign="top" cellpadding="0" cellspacing="0">
<tbody>
<tr class="postspace">
<td></td>
</tr>
<tr class="postrow">
<td class="postdistrict">
<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" align="left" valign="top" class="post1">
<td>
<td class="postdistrict">
<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" align="left" valign="top" class="post1">
<td>
</tr>
</tbody>
</table>
</li>
{/block:Photo}
{/block:Posts}
Naturally, I think I'll have to create some custom classes for the widths, but my main question is really how I should go about getting Tumblr to cycle through those widths, as can be seen in the example.
Thanks!

If you want them to cycle through the classes in order (like the example does) you can utilise the fact that tumblr lets you style each number of post.
Here is an example of what you would do:
<li class="post-{block:Post1}1{/block:Post1}{block:Post2}2{/block:Post2}[...]{block:Post15}15{/block:Post15}">
This would render as
<li class="post-1">
with the 1 depending on what number post it is.
From here you can easily make classes for .post-1 through to .post-15.
If you would like something random instead, javascript/jquery will be needed.

smart table using pagination angular

Using Angular smart table lib:
I just want to display the pagination buttons on the bottom. According to the documentation, it looks like st-pagination directives inserts those dom elements in there. However, for me, it is not working. Here is the plunker given by the smart table documentation:http://plnkr.co/edit/wzUHcc9PBF6tzH8iAEsn?p=preview
Here is my table footer code:
<tfoot>
<tr>
<td colspan="5" class="text-center">
<div st-items-by-page="10" st-pagination="">
</div>
</td>
</tr>
</tfoot>
I must be misunderstanding something. I know you can put your own customized template for the pagination.
Here is a screenshot, of the output and debugger:

You should use <td> tag only. you should not use <div> tag.
OK
<td colspan="5" class="text-center" st-items-by-page="10" st-pagination="">
</td>
NG
<td colspan="5" class="text-center">
<div st-items-by-page="10" st-pagination="">
</div>
</td>

ng-repeat in table and conditional tr

I have a collection of elements of different types. I want to iterate them using ng-repeat, and conditionally draw the right tr per each type.
I can't use ng-repeat-start since I want to use virtual scrolling and none of the libraries I found supports the start/end concept.
Here is a jsfiddle: http://jsfiddle.net/mx6v8j98/1/, which doesn't work. here is the HTML part:
<div ng-app ng-controller="MyCtrl">
<table>
<tbody>
<tr ng-repeat="item in itemsList" ng-switch="$even" ng-class-even="'even'" ng-class-odd="'odd'">
<div ng-switch-when="true">
<td>{{item}} is even</td>
<td>even content</td>
</div>
<div ng-switch-default>
<td>{{item}} is odd</td>
<td>odd content</td>
</div>
</tr>
</tbody>
</table>
</div>
In my real world case, I have many td with complex content, so I don't want to use ng-if/ng-switch-when on each
Update: I can put the ng-repeat on the <tbody> tag, but that looks ugly and I'm not sure what the consequences are regarding styling
Update II: In my case, the 'tr' tag itself is rendered differently according to a condition

As stated in another answer, <div> is not allowed as a child element of <tr>.
You are clearly trying to use <div> as a logical container for ng-switch-when, but since ng-switch-when (and ng-switch-default) supports multi-element, you don't need this container:
<tr ng-repeat="item in items" ng-switch="$even">
<td ng-switch-when-start="true">{{item}} is even</td>
<td>even content 1</td>
<td>even content 2</td>
<td ng-switch-when-end>even content last</td>
<td ng-switch-default-start>{{item}} is odd</td>
<td>odd content 1</td>
<td>odd content 2</td>
<td ng-switch-default-end>odd content last</td>
</tr>

It seems you cannot put <DIV> within <TR> but before <TD>.
Solution 1: Put conditional expression in every <TD>.
<!-- TDs for even row -->
<td ng-if="$even">{{item}} is even</td>
<td ng-if="$even">even content</td>
<!-- TDs for odd row -->
<td ng-if="!$even">{{item}} is odd</td>
<td ng-if="!$even">odd content</td>
Solution 2: For fairly complex table structure, you'd consider create your own directive to represent row cells.

Drop Down Content/Table and Page Jumping

I am coding a page with several dynamic/sortable tables in it (one below another) to share PDF documents. Each Document tittle in the table contain a link to open the PDF in a new tab. Everything works fine, BUT when I scroll down the page and open a dynamic table/or minimize the table, the page jumps to top of the page/to default position. JavaScript's RETURN FALSE fixes this problem but all the links in the table are dead. Can anyone help to fix this? I attach the basic code structure here you can see what I am doing...
HTML:
<div id ="fifth">
<ul id="droptable">
<li><h1>Tittle of The Dynamic Table5</h1>
<div>
<table class="sortable" width="100%" border="0">
<tr>
<td id="tablehead" width="55%">Sort by tittle</td>
<td id="tablehead" width="25%">Sort by Author</td>
<td id="tablehead" width="25%">Sort by date</td>
</td>
</tr>
<tr>
<td id="tabledata" width="55%"><a href="document1.pdf" target="_blank">Document1Name</td>
<td id="tabledata" width="25%">AuthorX</td>
<td id="tabledata" width="25%">DateX</td>
</tr>
<tr>
<td id="tabledata" width="55%"><a href="document2.pdf" target="_blank">Document2Name</td>
<td id="tabledata" width="25%">AuthorX</td>
<td id="tabledata" width="25%">DateX</td>
</tr>
<tr>
<td id="tabledata" width="55%"><a href="document3.pdf" target="_blank">Document3Name</td>
<td id="tabledata" width="25%">AuthorX</td>
<td id="tabledata" width="25%">DateX<a></td>
</tr>
</table>
</div>
</li>
</ul>
</div>
JAVASCRIPT:
// Dropdown Table Code
$(function(){
$('#droptable li a').each(function(){
$(this).click(function(){
$(this).siblings('div').slideToggle(300); // If I add RETURN FALSE here the page doesn't jump to the default position/to the top of the page (when open or minimize the table) BUT links in the table are out and don't work anymore //
});
});
});

2 things
1st id's should be unique, so change all instances of
id="tabledata"
to
class="tabledata"
2nd, try to give you td's that contain the link a different class than those that have data, then attach slide toggle to that class, maybe like:
$('.newclass').each(function(){
.....

I didn't succeed with the hints you gave but thanks anyway! I did everything but page was still jumping when opening/closing the table. BUT...I was browsing different forums and found this simple answer.
Using "#/" instead of "#" and the page won't jump. Hmm.. sometimes the answer is too simple, seemingly :o
<div id ="fifth">
<ul id="droptable">
<li><h1>Tittle of The Dynamic Table5</h1> ...
Rock'nRoll!