I don't even know how to describe this :)
I have bunch of divs, with similar IDs that have random part added to each (the random part is different for each session). and deeply nested in one of them a bunch of radio input boxes, without anything I can tie to (also the whole tree under the div doesn't have unique attributes I can tie to).
I need the first radio button. I get the needed div with (//div[contains(#id,'div-question')])[2], and I thought I could follow it up with similar construct, but I can't figure out how. I Also tired following:
(//div[contains(#id,'div-question')])[2]//input[#type='radio' and position() = 1]
but it return me all radio buttons, not only the first one (I'm using FirePath from FireBug -- could it be it's bug?)
So, how do I join two //... searches?
//x[position()=1] returns every descendant x that is the first child of its parent. To select the first descendant x, you need (//x)[position()=1]. With a complex path it becomes easier to use the descendant axis explicitly rather than the // shorthand:
descendant::div[contains(#id,'div-question')][2]
/descendant::input[#type='radio'][1]
Related
For example when implementing these collapsible items:
First approach that comes to my mind is to store a variable in the model expandedItems: List ItemId
to verify if an item is expanded you check if its id is in the list
to expand an item you add its id to the list
to collapse an item you remove its id from the list
There also are css-only solutions like this one https://jsfiddle.net/5hcwzf7s/2/
What would the advantages / disadvantages of css-only over the id list be?
I think storing the list in the model is common, easy to understand, and the usual way to do things like these.
I find a few downsides to the css solution:
is hard to read and understand
is fragile and hard to maintain
might not work on all browsers
uses href which makes the item id show up in the url when you click to expand
treats expanding as a url change, and when the user clicks back it unexpands the item instead of navigating to the previous page
only allows one item to be expanded at a time
On the other hand, I find no downsides to the expandedItems list approach. Performance might be a concern because we're operating on a list, but the user will have to be expanding thousands of items to make the list long enough to notice any difference. I don't think is polluting the model either, this kind of information is what the model should hold.
I think you want to put this all in your model. The css approach is perhaps a nice trick, but is not very scalable.
In particular you would end up putting state in the css file, and part of it even twice. Keep it all in your model, put the full content into the screen, and then just attach a class when contracted, which sets a max height and truncates the rest with elipsis
I am using a 3rd party scraper/crawler tool to pull in data from pages across a range of domains.
For example: Loading in the top 10 ranked articles for keyword 'x' and then pulling back elements of each page using some x path functions.
There are a couple of new elements I would like to start pulling, but I am not sure what the best approach would be to bring back the most accurate results.
Objectives:
Pull back the counts of ul, ol and li items across an article set
Pull back the text in each list element to compare how publishers
are writing on key topics
The issue is that I don't want to pull back navigation / menu elements that contain list items. I only want to pull in the data inside the body of each written article.
The easiest way might be to look for the H1 tag (since most sites only have 1 and its the main title of an article... and then pull the list items that show up AFTER the h1 tag. This should in theory eliminate anything in the main nav... but I am not sure how to do that in XPath.
Any idea on what the best approach might be to accomplish this?
Semi-newbie to jQuery; just can't quite get this...
I have a list of items on a page, and I want to insert a new item at the top of the list by (a) sliding the existing items down and (b) fading the new item into its position at the top of the list. I can get the new item inserted into the list, but so far all the effects I've gotten to work are things like $('#theList').prepend(theNewItem).hide().fadeIn(1000);, which fades in the entire set of items, including the new one, and doesn't do anything about the sliding.
Of course (?), part of my problem is that I need to be applying the .fadeIn (and, presumably, the .slideUp) methods to the new item, not the whole list, but I can't seem to get my hands on it. I can get the ID of the new item, but it's not showing up in the DOM after the prepend (at least, console.log('#theNewItemsID') is returning an empty list).
Any advice out there? Thanks much!
How about
$('#theList').prepend(theNewItem).children(':first').hide().fadeIn(1000);
Demo: http://jsfiddle.net/gaby/CrjQF/
Alternative
If the variable theNewItem holds a jQuery object then you can also use the .prependTo()docs method to skip the filtering
theNewItem.prependTo('#theList').hide().fadeIn(1000);
demo: http://jsfiddle.net/gaby/CrjQF/1/
Explanation
It happend because your initial selector is the #theList so the chained commands refer to that. Using the .children()docs method combined with :firstdocs selector we reduce the selected items to the first child of #theList (the newly added)
Using Watir to regression test some changes: I want to 'click' a row in a typical old style web page menu, where the menu is a table of tables. In this particular example, the table cell contains the menu item, and the row, which only consists of the one cell, has an onclick handler. I thought I could
cell = browser.element_by_xpath("//div[#id='Menu']/descendant::td[text()='New!'")
and use the cell to get the parent row, but I get the message
c:/ruby/lib/ruby/1.8/rexml/parsers/xpathparser.rb:330:in 'Predicate': undefined
method `[]' for nil:NilClass (NoMethodError)
which makes no sense to me.
We really need more detail before before an answer can be given
Generally speaking there are a few ways to deal with tables. You can use absolute indexes to the row and column numbers if that will always be the same, but a lot of times that's not the case.
If there's known (unique) text on the row somewhere, and the column of the cell is known, then you can often work via using a regular expression to identify the row with the known (and unique) text, and then identify the needed cell via it's 'column' within the row.
browser.row(:text, /my search text/).cell(:index, 2) # 2nd cell in the row that contains text matched by the regex
try this
cell = browser.div(:id,'Menu').cell(:text,'New!')
cell.click
and, maybe you lost closing ']' ?
cell = browser.element_by_xpath("//div[#id='Menu']/descendant::td[text()='New!']")
I have a tree representation of pages in a CMS application. I understand how to persist the tree in the database. However, I don't have a good way to:
A) Reorder subpages under a particular parent page.
B) Provide a UI implementation that allows the user to change the order.
Any suggestions?
Changing the order itself will require you store some sort of ordering along with each page in the database. Just the current highest / lowest value +/- 1 would probably be a fine starting point. Once you've got that ordering in there, reordering becomes a case of swapping two values or changing the value for one page to be between two others (you could use floats I guess, but you may need to renumber if you split it too many times).
Anyway, once you've got that, you need a UI. I've seen a very simple 'swap this with the one above/below' approach which can be a simple web link or an AJAX call. You could also present all the page values to the user and ask them to renumber them as they see fit. If you want to get fancy, JavaScript drag and drop might be a good approach. I've used ExtJS and Mootools as frameworks in this kind of area. If you don't need all the Extjs widgets, I'd say well away from it in future, and look at something like the Mootools Dynamic Sortables demo.
A) I have a similar CMS app and I store an ordinal value with the page for a particular tree and sort on this value -- because lots of my pages appear in completely different sites I have to maintain the ordinal number against a page / tree combination.
B) I too would like a better way to do this. Currently they click on the node in the treeview and in the main page screen they can move the page around. I've tried drag and drop with java script and other solutions but my users could never work with it without lots of hand holding. I'll be interested in the responses to this one.