I've got a GWT application that displays largely text spans. I'd like to programatically select all of the text currently in the browser window (similar to pressing from the browser menu).
Can anybody give me a pointer to this?
cheers,
Ian
The select all function is not available for the entire DOM, however there is a selectAll message for TextBoxBase, so what is commonly used for large quantities of text where you automatically want to do a select all is to put the text inside a TextArea. If you don't like the look you can remove the borders from the text area and set it to read-only so that it would appear as just plain text.
Related
Today I read some posts about the 'autocomplete' browser generated in the text fields, and i was wondering if it's possible to manipulate those results with jQuery, like highlight some part of the results or change the bg color (not that yellow one) or something like that.
I'm not talking about any plug-in 'autocomplete'.
Here's a example of what I'm talking about (Double click inside the text input and probably will show up some 'emails')
The browser handles that auto complete. Your page can't edit it. I for example, have it disabled so I don't see anything in the drop down list.
Sort of related:
You can disable it by adding the autocomplete="off" property to the input element.
Is there any JS functionality to get the text that is currently viewed by a user?
Assume there is a page with some text (or a lot of text) and I need some javascript-written black box that can retrieve text (any text within div, p, span ... or any other tags) that is currently visible on user's screen.
This should take in account the fact that user can scroll the page, only currently viewed text must be retrieved.
Is that possible with javascript?
How can this be implemeneted? (primarily for use in Firefox)
Do you know any js library that provides this functionality???
Thank you =)
I've created an example for you: http://jsfiddle.net/manuel/kuHHw/
I'm using jquery with the viewport selector plugin. The example shows the visible div's in green and appends the innerHTML into the span at the bottom of the page
I'm looking for a rich text editor that allows for locking regions so that they can't be edited by the user. These locked regions would contain markup, not just plain text. TinyMCE has a plugin to support this but it is quite buggy.
Rather than having the RTE contain the content you don't want edited, why not just put multiple editors around only the areas you want users to edit?
The problem I see with doing it the other way is that you could have individual nodes within the editable text with contenteditable off, but those nodes could still be part of a larger edit (e.g., they could be deleted). To truly prevent them being edited you'd have to check the current selection whenever it changed and disable all user actions until the selection didn't include the locked content. Even if you did that, it would be tricky to make sure that a user didn't add content in a place they weren't supposed to (before the first node, say, assuming the first node was locked).
How can I detect text selection from a text search using the browsers Ctrl+F.
For example, I want to make a FAQ, where are the items are closed (to remove clutter), and clicking them opens the text within them, but at the same time I don't want Ctrl+F to be broken.
So I'm thinking, is there a way for JavaScript to detect that I have searched for some text within a non visible (but selectable) block of text, and to automatically open it.
Is it even possible to detect text selection from a search with Ctrl+F? If so, how?
A more specific example: I have a div with the id of "one" and a div with the id of "two"
both have their own text:
<div id="one">Google is a search engine</div>
<div id="two">Stackoverflow users are very informative</div>
both have their text hidden from view but still selectable, but not by mouse (using margins or covering)
So a user searches for "Stackoverflow" on this page, I want to trigger a JavaScript function upon the search selection (how??), and I need the function that runs to know which div, with what ID has some text selected.
This is browser dependent. In Chrome (maybe Webkit in general?), it seems to use a selection that is separate from the one in the DOM API.
However, Firefox will use the DOM selection when highlighting text from a Ctrl+F.
For example, go to google.com, and type this in Firebug:
window.getSelection().toString()
This will return ""
Now do a Ctrl+F, type in Privacy, press enter.
Enter the above command again in Firebug, and you will get:
"Privacy"
As far as I know, there is no way. The content of the search field entirely under the control of the browser, and you can't access this from within the page.
What you might be able to do however, is detect a selection in the document and react to that. This will however probably produce many false positives (because you can't distinguish between an ordinary selection and a search), and it won't work with browsers that do not use an ordinary selection to highlight search results.
More info on detecting selections: Introduction to Range on Quirksmode
Why not make the FAQ search friendly and use a service for that. Google Custom Search Engine might be a good place to start.
I'd like to take the selected text on screen (text highlighted with the mouse) and when a button is pushed wrap that text in a tag. I'd like to use jquery but if it can be done in another framework that would be fine too.
I haven't been able to figure out how to do this yet, so any thoughts are appreciated. Also I know you can run into issues if the text goes across several elements so for now case just assume the text highlighted is all contained in a tag.
Thanks!
Highlighting the selected text doesn't necessarily require you to wrap it. In fact, trying to wrap it is difficult if the range of the selection spans multiple tags (i.e. doesn't surround nicely closed tags).
Here's an answer that highlights the current selection without wrapping it: Javascript Highlight Selected Range Button.
He uses execCommand to let the browser highlight the current document selection for you. Pretty sweet.
Here is a post on working with selected text. The getSelection() method can be used to get the selected text, then you should be able to replace that text with text wrapped in a tag.