Databases
StackOverflow2013
Postsdbo
PO
 

Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>First, the information you get from <code>Range</code> objects are about as useful as you can get: for each of the start and end boundaries of the Range you get a DOM node and an offset within that node (a character offset inside a text or comment node or a child node offset otherwise), which completely describes the boundary. What you mean by "absolute start and end points" I imagine is two character offsets within the whole editable element, but that is a slippery concept: it seems simple, but is tricky to pin down. For example, how many characters does a paragraph break count for? A <code>&lt;br&gt;</code>? An <code>&lt;a&gt;</code> element with <code>display: block</code>? Elements such as <code>&lt;script&gt;</code> elements that contain text but are not visible to the user? Elements hidden via <code>display: none</code>? Elements outside the normal document flow, such as those positioned via <code>position: absolute</code>? Multiple consecutive whitespace characters that are rendered as a single visible character by the browser?</p> <p>Having said all that, I have recently had a go at writing code to do this, and yes, it does involve DOM manipulation (although not <em>that</em> horrendous). It's extremely rudimentary and doesn't deal satisfactorily with any of the above issues, partly because I knocked it up quite quickly for a question on SO, and partly because in general I don't think it's possible to deal nicely in general with all those issues. The following answer provides functions for saving and restoring the selection as character indices within an editable element: <a href="https://stackoverflow.com/questions/5595956/replace-innerhtml-in-contenteditable-div/5596688#5596688">replace innerHTML in contenteditable div</a></p>
    singulars
    1. This table or related slice is empty.
    1. POCalculating the absolute start and finish of a range (highlighted text) within an editable div
      singulars
      1. PTQuestion
    1. PTAnswer
    1. USCommunity
    1. USTim Down
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. POCalculating the absolute start and finish of a range (highlighted text) within an editable div
      singulars
      1. PTQuestion
    1. This table or related slice is empty.
    1. VO
      singulars
      1. PO
      1. This table or related slice is empty.
      1. VTAcceptedByOriginator
    1. COHi Tim, thanks for taking the time to reply! The biggest problem I have with the DOM method is if I have a repeated sentence how do I know which one was highlighted? (i.e. CONTENT: <span style="color: red;">Hello</span> World! <span style="color: red;">Hello</span> World! ). Also what I mean by absolute is simply the number of characters from the start of the parent container to the positions of the selection boundaries (so a <br> would be 4, the span opening above is 26 etc). If I have this information I can grab the contents complete with (partial) tags etc and choose how to handle the data.
      singulars
      1. PO
      1. USPaul Norman
    2. CO@Paul: You seem to be thinking of the DOM as the string of HTML from which the browser initially constructed the page. This isn't generally a helpful way to think of it. Firstly, the DOM is a tree. Secondly, once the the browser has constructed the DOM from the page's HTML, there is no reliable way of getting that initial HTML string back, so any offset within that string is essentially meaningless. What is it that you're actually trying to do?
      singulars
      1. PO
      1. USTim Down
    3. COI'm not confused by the DOM at all, but I'm also not interested in it! I just want to be able to return the HTML content of the highlighted area (including any tags it contains) to the JS function and know the start / end positions of it within the HTML. I really can't believe that more people don't! No hidden agenda, no required use case, I'd genuinely just like to know how to do it reliably.
      singulars
      1. PO
      1. USPaul Norman
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload