Search WebView for Text

gobblegob · Jun 15, 2011

Hi,

I have searched all the documents and tutorials but failed to find out the best way to search documents for a string.
eg if i have 2 html files and i want to search for a string, and if found return which html file it found it in. How would be the best way to do this?

Cheers Waz

nfordbscndrd · Sep 3, 2011

Don't know why I didn't do this before, but I just Googled for "Android WebView anchor bug" and got a lot of hits where people are posting requests for help with this problem and nobody has an answer (that works).

Also, I just realized that all the links to anchors in my table of contents work perfectly. It's just when I try to load a file with the anchor appended to the end of the file name ("...myfile.htm#SomeAnchor") that it doesn't work (on devices smaller than 10").

nfordbscndrd · Sep 4, 2011

While I was out walking this morning, I was thinking about how jump-to-anchor works when the document is not being reloaded. This got me to thinking about some way of having a fixed header in the browser that would be part of the document and in which I could put a link to an anchor saying "Bring found text to top of page". Then when I reloaded the document, if the user couldn't see the target text, clicking the button should bring it up.

So I Googled around and found a few ideas (such as these) about setting a fixed margin at the top which wouldn't scroll, but none of them worked, even in my Windows browser, much less in WebView.

Anyone know of any Javascript or something that would do this? Frames won't work because the heading needs to be part of the same file so that the link in the heading will bring up the text in the main body of the file without reloading it.

JesseW · Sep 4, 2011

Consider using an html table with two rows. The top for your header with a fixed height using css, and the second row for your reloaded data. I dont know the syntax for doing this, but I have recently run across a post where someone provided a link to instructions. You could search for it. Hope this helps a little...

nfordbscndrd · Sep 4, 2011

I've Googled "html fixed table height" and "css fixed table height" and looked at pages until I'm going blind and haven't found anything that works.

Meanwhile, I did find Fixed header which works in IE7 but when I save the source code for that page to disk and load it into IE7, it doesn't work.

Also, when I load it into WebView using the last test app I uploaded (above), it works on my Toshiba Thrive running Android 3.1 but not on my Archos 70 running Android 2.2.

I've spent many hours today looking for a work-around and 99% of the stuff posted on the Internet just doesn't work at all, and what does work the other 1% doesn't work all the time, as just described. Sigh...

warwound · Sep 5, 2011

You plan to return to the anchor method then - and your only problem now is that an anchor in the page url doesn't scroll when the page loads?

But once the page has loaded you can successfully scroll to an anchor?

Here's a page i found useful many times - it'll help you position a (floating?) header on the page: Learn CSS Positioning in Ten Steps: position static relative absolute float.

Martin.

nfordbscndrd · Sep 5, 2011

I tried a number of different ways to create a floating window and never found anything that worked in WebView.

Caravelle · Sep 5, 2011

I'm sorry that this does not offer any help, but can I just say I admire your tenacity and determination. The fact that you are actually trying to provide help at all with an application speaks volumes. Hands up those of us who have downloaded apps from the store and not been able to work out how to make them do what they're supposed to do, let alone work out what it actually is they are supposed to do.

Caravelle

warwound · Sep 6, 2011

nfordbscndrd said:
I tried a number of different ways to create a floating window and never found anything that worked in WebView.

Well the CSS position fixed style is what you need:

B4X:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<style type="text/css">
#menu{
   position:fixed;
   left:2px;
   top:4px;
   border:1px solid black;
}
</style>
</head>
<body>
<div id="menu"><a href="javascript:void()">Bring found text to top of page</a></div>
<div>
   <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum dolor mi, rutrum sed placerat consectetur, hendrerit sit amet nunc. Maecenas lobortis tristique justo, vitae pharetra augue iaculis a. Maecenas ac ornare lorem. Pellentesque hendrerit, augue quis viverra accumsan, sem magna hendrerit ipsum, quis lobortis augue quam quis dolor. Vestibulum adipiscing interdum bibendum. Pellentesque vulputate, orci nec consectetur aliquam, est nibh iaculis erat, sed aliquam ante libero quis nisl. In fringilla adipiscing ligula nec imperdiet. Maecenas a dui justo, vel iaculis purus. Aliquam quis facilisis quam. Sed nec justo a nisl auctor fringilla. Suspendisse tempor nisl sit amet nisl auctor iaculis in ut augue. Maecenas congue aliquam malesuada. Nam eu mattis quam. Nunc posuere, metus nec tincidunt sollicitudin, metus leo tristique eros, eget aliquam leo justo sed turpis. </p>
   <p> Aliquam viverra mollis odio nec pharetra. Nullam vel interdum magna. Nullam nec mauris nec mi aliquet elementum vitae quis erat. Mauris pretium enim quis sem accumsan nec varius neque pretium. Nam eget nunc sapien. Mauris pretium, purus quis elementum hendrerit, erat urna bibendum tellus, id dignissim tellus nibh non massa. Phasellus dolor justo, ornare sed lacinia sit amet, ultrices nec quam. Fusce nibh nibh, iaculis a ullamcorper non, fermentum at neque. Ut id sem nibh, nec pellentesque ipsum. Vestibulum pretium elementum sem a mollis. Fusce egestas feugiat ipsum, a tempus nulla dictum auctor. Vivamus non dui bibendum justo feugiat pulvinar vel a mauris. Mauris dignissim leo ut nibh faucibus consequat. </p>
</div>
</body>
</html>

Would you believe mobile WebKit does NOT support the position fixed style!
(It works as expected in a desktop browser though).

Google "webkit position fixed"

This page seems to sum it up: Position Absolute, web apps and front-end stuff - The mobile webkit fixed position problem «.

Martin.

nfordbscndrd · Sep 6, 2011

The code in your last post doesn't work in IE7 for me. The header is fixed, but you can see the body of the page scrolling underneath it. The best CSS fixed header code I found was the one linked in my previous message: Fixed header

It even has a separate scroll bar for the body of the page. And it works on my 10" Android 3.1 tablet, but not on my 7" Android 2.2 tablet (and IE7). But I have been unable to get it to work anywhere when I save the page to disk and then load it from there: I don't get the green background on the header and so I can see the body scrolling underneath it. If I could just figure out why it works from the URL linked above but not from my hard disk, that would be something, but then I would still have the problem of it not working with Android 2.2 (or not with the Archos 70, anyway).

madmax2012 · Mar 30, 2013

Hi there

I'm making program for fast and easy legal code reading in polish language.
When I'm click search in my program I'm losing all my polish characters like "Ł Ó Ś Ć" ect...
I'm using code example made by nfordbscndrd

Is there a solution to keep polish characters after clicking search ?

Thanks for help

GMan · Jun 12, 2014

Reading in a string and seperating the used data from it is no problem.

When i call:

B4X:

Sub Globals
Dim screwprice as string
End Sub

...
...

Sub ProcessHTML(html As String)
...
...
ToastMessageShow(screwprice,True)
End Sub

the displayed result text is i.e. 231,23

When i try

B4X:

Screwpricelabel.Text = screwprice

a long error appears: Only the original thread that created a view hierarchy can touch it views

the Screwpricelabel is a normal label on the activity, done by the designer

How can i solve this problem ?

warwound · Jun 12, 2014

The java that executes when your javascript calls the CallSub method runs on a non UI thread.
It has a boolean parameter 'callUIThread'.

CallSub(subName As String, callUIThread As boolean)
CallSub(subName As String, callUIThread As boolean, parameter1 As String)
CallSub(subName As String, callUIThread As boolean, parameter1 As String, parameter2 As String)
CallSub(subName As String, callUIThread As boolean, parameter1 As String, parameter2 As String, parameter3 As String)

Pass True as the callUIThread parameter and the java will handle the different threads.

Martin.

GMan · Jun 12, 2014

Thx for U reply...how and where can i do that ?

warwound · Jun 12, 2014

In the webpage loaded in the WebView you must be using javascript such as:

B4X:

B4A.CallSub('ProcessHTML', false, <some-value-here>);

Change the boolean parameter in the javascript to true:

B4X:

B4A.CallSub('ProcessHTML', true, <some-value-here>);

The ProcessHTML Sub will now be executed on the main UI thread, not a background thread.

Martin.

GMan · Jun 12, 2014

Muchas gracias - that's it

B4X:

Javascript="B4A.CallSub('ProcessHTML', true, document.documentElement.outerHTML)"

works great !

Search WebView for Text

gobblegob

Member

nfordbscndrd

Well-Known Member

nfordbscndrd

Well-Known Member

JesseW

Active Member

nfordbscndrd

Well-Known Member

warwound

Expert

nfordbscndrd

Well-Known Member

Caravelle

Active Member

warwound

Expert

nfordbscndrd

Well-Known Member

madmax2012

New Member

GMan

Well-Known Member

warwound

Expert

GMan

Well-Known Member

warwound

Expert

GMan

Well-Known Member

Similar Threads