I have a custom html(suppose a.html) file which i am using from the resources and thus building a string with the entire document which is then passed to the WebView.
There's some text in a.html on click of which i want load another file b.html in the webview itself.
Please let me know what is the apporach to be followed here.
Step #1: Implement a WebViewClient, overriding shouldOverrideURLLoading().
Step #2: In shouldOverrideURLLoading(), load what you want -- this will be called on link clicks and redirects, and you are supplied the URL that ordinarily would be loaded.
I think if you set a WebViewClient and override shouldOverrideUrlLoading() then you can have the link loaded into the current WebView by returning false.
Related
I am developing a sample app using phonegap with the jQuery mobile plugin for android. I created a page, main.html. From main.html, I am able to catch the event. Once button is pressed in the main page, I change the contents using( $.mobile.changePage("path") ) function to signup.html. I have button in signup.html but when I click that button click event does not get fired. I have loaded all the js file in signup.html as well. what am doing wrong? Please guide me.
Clarification: Should I keep only one html (main.html ) and through that I have to do page navigation.?
In case your second page javascript is placed inside a HEAD content
If I understood you correctly, you are using ajax to load this page into the DOM? If this is true then I understand your problem. You see, when ajax is used for page loading only BODY content is loaded into the DOM.
You can fix your problem if you initialize your second html page javascript inside a first HTML file or move your SCRIPT block inside a second HTML BODY content.
Also, I have described this problem in my other ARTICLE with more details and few examples, or it can be found HERE.
In case you have several buttons with a same id
This could also be a little different problem. You see, if you have 2 buttons with a same id, they are both inside a DOM structure. If you try to bind a click event on a second page button, that same event will be bound to the button on a first page. Because they have a same id jQuery will bound an event to the first button (with that id) found in the DOM.
To fix this problem you need to use a jQM constructor called active page. One more warning, next code example will work only in a page events initialized after a pageinit event, for example pagebeforeshow or pageshow events:
$(document).on('pagebeforeshow', '#yourPageID', function(){
// Registering button click
$(document).on('click', $.mobile.activePage.find('#myButtonID'), function(){
// Do something
});
});
This line of code:
$.mobile.activePage.find('#myButtonID')
Will only get button '#myButtonID' found in a current active page, no matter how many other buttons with a same id exist inside the DOM.
Answer to the last question
About your last questions. It doesn't matter which template structure you use (1 HTML with multiple pages or multiple HTML's), you just need to worry about things I mentioned before.
Did you wrap your code inside following snippet?
$(document).on('pagebeforeshow', '#yourPageID', function(){
// Registering button click
$('#myButtonID').bind('click',function(){
$.mobile.changePage('yourfile.html');
});
});
if you just wrap it inside your <script></script> tag the event will not fire.
Did you get any error in the console? Check DDMS for it.
In my application i use a mix of html and native. In my web view i load a html page which has a which has an image in it. On click of the image i call a java script function which in turn calls the native code. My html tag is as below:
<img onclick=nextLevel('0'); id="d2">
My javascript method is as below:
function nextLevel(index)
{
Android.displayNextLevel(index);
}
Within the displayNextLevel method i start the next activity. The issue is when i click on the image on the html page multiple times the event gets triggered multiple times and the activity opens up multiple times. Am i missing out on something? How do i overcome this issue? Kindly help me with this. Thanks in advance.
I guess you could fiddle around in the html/js to make sure you can only click it once every now and then.
You could also ditch your function and instead use the JavascriptInterface so you can handle stuff in your Java code instead.
While trying to use loadUrl(String url, Map additionalHttpHeaders) method of webView, the response that I receive is not able to display the image. Instead of the image, a question mark substitute is used.
So, I tried to hit the same URL using Java code. The HTML code received during this process showed that the tag's src attribute was using a relative location.
On passing this same HTML code to webView's loadData() method, I get the same output as mentioned in the first case.
Anyway to fix this issue? (In the additionalHttpHeaders I was passing the authorization header)
I have a webview in a alertbox, in this webview I have a <textarea>
Anyone have an idea how to get the texts typed in this field and be used in the android app. as normal Edittext fields
Happy Coding..!
Its not possible as you are saying. An alternative can be helpful. You should add an interface to your WebView which contains a method which can get value from web page. You have create and to call a javascript function which can pass the value of your textarea to your interface function by using that Interface. I hope you understand.
For example: Add an interface to your Webview like:
mainView.addJavascriptInterface(MyOwnCreatedClassName, "AndroidInterface");
Here MyOwnCreatedClassName is the name of the class which will contain that method and AndroidInterface is the name that the Javascript will use to call that method.
for complete example follow:
Using webView.AddJavascriptInterface with MonoDroid
I am displaying a html in a custom activity with a webview. I am overriding
public boolean shouldOverrideUrlLoading(WebView view, String url) {
to intercept certain urls. Now I would like to be able to figure out some more details about the html around that url.
In my case I would like to get the html element that contains the url. E.g. if the url comes from
Manfred Moser
I would like to be able to somehow retrieve the value "Manfred Moser" from within the anchor tag. Is there a way to do that. I found that you do not have access to the DOM from Java.
One way I can think of would be to download the page separately and parse it all before even loading it in webview. However that is an ugly hack at best. Is there a better way?
There is a dirty hack:
Bind some Java object so that it can be called from Javascript with WebView:
addJavascriptInterface(javaObjectExposed, "JSname")
Force execute javascript within an existing page by
WebView.loadUrl("javascript:window.JSname.passData("some data");");
Described here: http://lexandera.com/2009/01/extracting-html-from-a-webview/
Note: this is a security risk - any JS code in this web page could access/call your binded Java object. Best to pass some one-time cookies to loadUrl() and pass them back your Java object to check that it's your code making the call.
In addition to #Peter Knego's approach, there is the inverse:
Use addJavascriptInterface(), per his step #1
For your link, use an onClick attribute on your <a> tag to call out some method on the Java object from step #1, where the Java object turns around and loads the URL into the WebView, and supplies whatever sort of identifying information you want.
Suffice it to say, there's no way to get the information you want from shouldOverrideUrlLoading().