UIWebview get range of selected text and save for later use

Question

I got the range of a selected text from UIWebView using the following java script function :

function getRangeForSelectedText() {
    var selection = window.getSelection(); 
    var range = selection.getRangeAt(0); 
}

I have to save this range for later use (I want to use this range to highlight the text when the user loads the doc at a later time). How can i save a java script object(range) in objective C?

Is there any other method to hightlight a text in a UIWebview other than giving the range?

score 0 · Answer 1 · edited May 23 '17 at 10:24

see that post http://blog.techno-barje.fr/post/2010/10/06/UIWebView-secrets-part3-How-to-properly-call-ObjectiveC-from-Javascript/

and that How to call Objective-C from Javascript?

you can send some string to your UIWebView using script

function sendURLToUIWebView(url) {
    var iframe = document.createElement("IFRAME");
    iframe.setAttribute("src", url);
    document.documentElement.appendChild(iframe);
    iframe.parentNode.removeChild(iframe);
 }

your url should has specific schem f.e. myappcomand://

and you can handle it with UIWebViewDelegate method (set some object as delegate of UIWebView, f.e. some UIViewController)

- (BOOL)webView:(UIWebView *)aWebView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
 BOOL shouldLoad = YES;
    if ([request.URL.scheme isEqualToString:@"myappcomand"]) {
         shouldLoad = NO;
         // parse url string "request.URL" and extract your parameters to store them
    }
return shouldLoad;
}

your javascript functions

function sendURLToUIWebView(url) {
    var iframe = document.createElement("IFRAME");
    iframe.setAttribute("src", url);
    document.documentElement.appendChild(iframe);
    iframe.parentNode.removeChild(iframe);
 }

function getRangeForSelectedText() {
    var selection = window.getSelection(); 
    var range = selection.getRangeAt(0);
    var url = "myappcomand://" + "range=" + range; // you should convert range to string 
    sendURLToUIWebView(url);
}

Update:

range to string

range.toString().replace(/\s+/g, ' ').replace(/^\s+|\s+$/g, '')

or just var rangeText = window.getSelection().toString();

see Strange behaviour with range.toString()

But my problem is how i can covert range object into a string. Range object consists of start container , end container, start offset,end offset. I can convert start offset and end offset into string because they are integers. But start container and end container are node objects. — Priyanka V, Oct 10 '13 at 10:54
@PriyankaV what streeng do you have when you use range.toString() ? — BergP, Oct 10 '13 at 11:00
range.toString().replace(/\s+/g, ' ').replace(/^\s+|\s+$/g, '') this is giving the selected text. But i dont need selected text — Priyanka V, Oct 10 '13 at 11:01
can you convert to string some one from those variables? var startNode = range.startContainer, endNode = range.endContainer; endNode.length; range.startOffset; — BergP, Oct 10 '13 at 11:08
i converted range.startOffset and range.endOffset to string and send back to objective c as a string: function f() { var txt = window.getSelection(); var anchorNodeProp = txt.anchorNode; //get the node object return (txt.anchorOffset + '|' + txt.anchorNode.textContent + '|' + txt.focusOffset + '|' + txt.focusNode.textContent); } NSString *rangeObject = [self.webview stringByEvaluatingJavaScriptFromString:@"f()"]; But what can i do with that start container object. — Priyanka V, Oct 10 '13 at 11:12

score 0 · Answer 2 · answered Nov 15 '13 at 07:24

I faced the same problem. Instead of getting selected range, i just highlighted the selected text using below function in js and fetch full text in UIWebView and replaced that in sqlite.

JS code:

function highlight() {

    if (typeof window.getSelection != "undefined") {
        var range = window.getSelection().getRangeAt(0);
        var selectionContents = range.extractContents();
        var span = document.createElement("span");
        span.appendChild(selectionContents);
        span.setAttribute("class","uiWebviewHighlight");
        span.style.backgroundColor = "rgb(237,191,245)";
        span.style.color = "black";
        range.insertNode(span);
    } 
}

Objective C:

- (void) highlightText
{
    NSString *highlightFunction = [NSString stringWithFormat:@"highlight()"];
    [detailedWebView stringByEvaluatingJavaScriptFromString:startSearch];
    NSString *highlightedString = [detailedWebView 
                         stringByEvaluatingJavaScriptFromString:@"document.documentElement.outerHTML"];
}

Simply replace old html string with highlightedString.

UIWebview get range of selected text and save for later use

2 Answers2