Open WebView form in the browser when pressing the submit button - android

I have an HTML form inside a WebView. The form control looks like a regular button, but actually it is an html file with a transparent background. When I press the HTML submit button, I want the result to open in the browser, not in the webview. Currently it is opening in the current WebView which is wrecking my layout.
How do I do this?
Here is my Form
<string name="googlecheckout_html_button">
<![CDATA[
<?xml version=\"1.0\" encoding=\"ISO-8859-1\"?>
<!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\" xml:lang=\"en\">
<head>
<title>Google Checkout Button</title>
<script type=\"text/javascript\" language=\"javascript\">
function pass() {
return javaInterface.checkboxPass();
}
</script>
</head>
<body>
<form style=\"width: 121px;margin-left: auto;margin-right: auto;\" onsubmit=\"return pass();\" action=\"https://%1$sapi/checkout/v2/checkoutForm/Merchant/%2$s\" id=\"BB_BuyButtonForm\" method=\"post\" name=\"BB_BuyButtonForm\">
<input name=\"item_name_1\" type=\"hidden\" value=\"%3$s\" />
<input name=\"item_description_1\" type=\"hidden\" value=\"%3$s\" />
<input name=\"item_quantity_1\" type=\"hidden\" value=\"1\" />
<input name=\"item_price_1\" type=\"hidden\" value=\"%4$s\" />
<input name=\"item_currency_1\" type=\"hidden\" value=\"%5$s\" />
<input name=\"_charset_\" type=\"hidden\" value=\"utf-8\" />
<input type=\"hidden\" name=\"shopping-cart.items.item-1.merchant-private-item-data\" value=\"%6$s\" />
<input alt=\"Pay With Google Checkout\" src=\"https://%1$sbuttons/buy.gif?merchant_id=%2$s&w=121&h=44&style=trans&variant=text&loc=en_US\" type=\"image\" />
</form>
</body>
</html>
]]>
</string>
I am then using String.format(arg...) to populate the fields with appropriate values.
Here is by WebView
String form = String.format(getString(R.string.googlecheckout_html_button),
host,
merchantId,
item_name_1,
item_price_1,
item_currency_1,
private_item_data
);
if(Logging.DEBUG) Log.d(TAG, form);
browser = new WebView(ActivityActivate.this);
browser.setBackgroundColor(0);
browser.getSettings().setJavaScriptEnabled(true);
browser.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);
browser.getSettings().setSupportZoom(true);
browser.setWebViewClient(new WebViewClient() {
#Override
public boolean shouldOverrideUrlLoading(WebView view,
String url) {
return false;
}
});
//browser.getSettings().setLoadsImagesAutomatically(true);
browser.addJavascriptInterface(new JavascriptInterface(), "javaInterface");
//browser.loadData(header+formData+footer, "text/html", "UTF-8");
browser.loadDataWithBaseURL("https://checkout.google.com", form, "text/html", "UTF-8", null);
llPaymentButtons.addView(browser);

Forms are submitted to servers not to browsers. Make sure you have a correct URL where you are submitting the form.
To solve your problem you must override WebViewClient.shouldOverrideUrlLoading(..):
webview.setWebViewClient( new WebViewClient() {
public void shouldOverrideUrlLoading (WebView view, String url) {
return false;
}
});

Related

Android 10: Scan new card not working in Google chrome

I am integrating html page in webview and in that i need to scan the credit card.
But, in my android device version 10, "Scan new card" option is not visible.
In android 8, this option is visible but Card holder name is not coming.
So anyone have any idea about the same?
Below is the activity code:
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mWebView = findViewById(R.id.activity_main_webview);
WebSettings webSettings = mWebView.getSettings();
webSettings.setJavaScriptEnabled(true);
mWebView.setWebViewClient(new MyWebViewClient());
// REMOTE RESOURCE
mWebView.loadUrl("https://hostedhtml/");
}
Below is the html code:
<form action="freedomofkeima://?ThisIsResponseSample" method="get">
<label for="nameoncard">Name on Card</label>
<input autocomplete="cc-name" id="nameoncard" name="nameoncard" type="text">
<label for="ccnumber">Credit Card Number</label>
<input autocomplete="cc-number" id="ccnumber" name="ccnumber" type="text">
<label for="cc-exp-month">Expiration Month</label>
<input autocomplete="cc-exp-month" id="cc-exp-month" name="cc-exp-month" type="text">
<label for="cc-exp-year">Expiration Year</label>
<input autocomplete="cc-exp-year" id="cc-exp-year" name="cc-exp-year" type="text">
<input name="submit" type="submit" value="Submit">
</form>
MyWebClient code:
#Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
String hostname;
// YOUR HOSTNAME
hostname = "example.com";
Uri uri = Uri.parse(url);
if (url.startsWith("file:") || uri.getHost() != null && uri.getHost().endsWith(hostname)) {
return false;
}
Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(url));
view.getContext().startActivity(intent);
return true;
}

How to load pdf from java to object in html

I develop a mobile app hybrid and i want to preview a pdf file that i get from web service.
The problem is the connection to the web service i do from java class and i want to preview the PDF in html.
I search in google and this i have until now and this not work for me.
Here my code:
Main Activity:
public class MainActivity extends AppCompatActivity {
private boolean wantExit;
private ActionsApp doActions;
private WebView view;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);
doActions = new ActionsApp();
view = new WebView(this);
view.getSettings().setJavaScriptEnabled(true);
view.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);
view.loadDataWithBaseURL("file:///android_asset/js/index.js", "javascript", "application/javascript", "UTF-8", null);
view.loadUrl("file:///android_asset/html/index.html");
view.addJavascriptInterface(doActions, "action");
setContentView(view);
}
}
ActionsApp Class: this class used for action to the web service
public class ActionsApp {
public ActionsApp(){}
#JavascriptInterface
public String getFile(String idObjStr) {
ObjectVersion objectVer = null;
JSONObject jsonObject = null;
JSONParser jsonParser;
int idObj;
InputStream fileStream;
try {
fileStream = get from web service the file as Stream: application/png
jsonParser = new JSONParser();
jsonObject = (JSONObject)jsonParser.parse(new InputStreamReader(fileStream, "UTF-8"))
} catch (ParseException e) {
e.printStackTrace();
}
return jsonObject.toString();
}
}
index.js: when i click on button in another page(not the page that i wrote down here) the start this function in the js file.
function openFile(objectID)
{
$.mobile.changePage( "#pdfFile" );
var container = $('#previewContainer');
var pdfObject = $('#pdfObject').remove();
// The "format=pdf" parameter instructs the server to create a pdf preview
of the file and return it.
pdfObject.attr('type', 'application/pdf')
.attr('data', JSON.parse(window.action.getFile(objectID)));
container.append(pdfObject);
}
index.html: this page is to perview to pdf file that i get from the function in js file through ActionsApp class.
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet"
href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-
1.4.5.min.js"></script>
</head>
<body>
<div id="pdfFile" data-role="page" data-theme="a">
<div data-role="header" data-theme="b">
<h2>pdf</h2>
</div>
<div data-role="content" class="ui-content">
<div id="previewContainer">
<!-- Embed a pdf previewer using an <object> element. This element
is modified in JavaScript. -->
<object id="pdfObject" width="100%" height="100%">
</object>
</div>
</div>
</div>
<link rel="stylesheet" type="text/css"
href="file:///android_asset/css/index.css">
<script src="file:///android_asset/js/index.js"></script>
</body>
</html>
Any suggestions?
Thanks,
Tal

Android WebView showing blank page for local files

My android WebView is showing a blank page when I try to load "file:///android_asset/index.html" and it perfectly loads other url like "http://twitter.com".
My activity
public class MainActivity extends ActionBarActivity {
private WebView myWebView;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
myWebView = (WebView) findViewById(R.id.webview);
myWebView.addJavascriptInterface(new WebAppInterface(this), "Android");
myWebView.setWebViewClient(new WebViewClient());
WebSettings webSettings = myWebView.getSettings();
webSettings.setJavaScriptEnabled(true);
myWebView.loadUrl("file:///android_asset/index.html");
}
#Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
if ((keyCode == KeyEvent.KEYCODE_BACK) && myWebView.canGoBack()) {
myWebView.loadUrl("file:///android_asset/index.html");
return true;
}
return false;
}
}
My index.html file :
<!DOCTYPE html>
<html>
<head>
<title>World Tour</title>
<!-- Sets initial viewport load and disables zooming -->
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui">
<!-- Makes your prototype chrome-less once bookmarked to your phone's home screen -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="mobile-web-app-capable" content="yes">
<link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="stylesheet" type="text/css" href="css/ratchet.css">
</head>
<body>
<header class="bar bar-footer">
<span class="icon icon-info pull-left" ></span>
<span class="icon icon-plus pull-right" ></span>
<h1 class="title">List of previous drive</h1>
</header>
<div class="content">
<div class="card">
<ul id="drives-list" class="table-view">
<li class="table-view-divider table-view-cell" ><p class="pull-left">Comments</p><p class="pull-right">Distance</p></li>
</ul>
</div>
</div>
<script type="text/javascript" src="js/main.js" ></script>
<script type="text/javascript" src="js/ratchet.js" ></script>
</body>
</html>
Thanks for helping !
get string content from your assests file using below code
public static String getStringFromAssets(String name, Context p_context)
{
try
{
InputStream is = p_context.getAssets().open(name);
int size = is.available();
byte[] buffer = new byte[size];
is.read(buffer);
is.close();
String bufferString = new String(buffer);
return bufferString;
}
catch (IOException e)
{
e.printStackTrace();
}
return null;
}
and load content using below code
String m_data = getStringFromAssets("index.html", this);
webView.loadDataWithBaseURL("file:///android_asset/", m_data, "text/html", "utf-8", null);
Hope it works for you !!
Checkout if there are any errors in javascript code associated with the html page. If so android studio doesn't point out errors in js file.
I fixed the errors in the js file and it worked.

Removing div tag from url loaded from webview android

I am loading a url into webview using web.loadUrl(url);. Now i want to remove part the body content when the url finished loading.
Data from the url is as follows :
<html>
<body>
<div class="header" data-role="header" data-theme="a">
<a data-icon="back" class="header-icon" data-iconpos="notext" href="mymob-web-mobile/restricted/menu.xhtml" data-ajax="false"> <span>Back</span> </a>
<!--Title-->
<h1>???help.main.title???</h1>
</div>
<div id="well">Hello World</div>
<body>
</html>
I want to remove this part in the url
<div class="header" data-role="header" data-theme="a">
<a data-icon="back" class="header-icon" data-iconpos="notext" href="mymob-web-mobile/restricted/menu.xhtml" data-ajax="false"> <span>Back</span> </a>
<!--Title-->
<h1>???help.main.title???</h1>
</div>
After some researh i come to this solution:
web= (WebView)findViewById(R.id.web);
web.setWebViewClient(new WebViewClient() {
#Override
public void onPageFinished(WebView view, String url)
{
web.loadUrl("javascript:var con = document.getElementByTagName('<div class=\"header\" data-role=\"header\" data-theme=\"a\"> '); " +
"con.style.display = 'none'; ");
}
});
web.clearCache(true);
web.clearHistory();
web.getSettings().setJavaScriptEnabled(true);
web.getSettings().setJavaScriptCanOpenWindowsAutomatically(true);
web.loadUrl(Constant.URL_AIDE, headers);
But the div element is not being removed.
a summery is , div to remove
<div class="header" data-role="header" data-theme="a">
<a data-icon="back" class="header-icon" data-iconpos="notext" href="mymob-web-mobile/restricted/menu.xhtml" data-ajax="false"> <span>Back</span> </a>
<!--Title-->
<h1>???help.main.title???</h1>
</div>
expected result
<html>
<body>
<div id="well">Hello World</div>
<body>
</html>
any idea please
You can use getElementsByClassName() to access the div. Here is my solution please try it.
web.setWebViewClient(new WebViewClient() {
#Override
public void onPageFinished(WebView view, String url){
web.loadUrl("javascript:document.getElementsByClassName('header')[0].style.display=\"none\";");
}
})
Your JavaScript is incorrect. There is no such thing as getElementByTagName, other than getElementById other getElements... functions return a list of nodes. It should be something like:
[].slice.call(document.getElementsByClassName("header")).forEach(function(element) {element.style.display = 'none';});

Interfacing with Html And Android

I have developed a media player in Html.Now my job is to play streaming Url in Html coded media player coming from Android activity.So i have need to pass url from android activity to Html media player files where it will be play.I have searched lot but haven't find any good solution.please suggest me. Thanks
Java Code
setContentView(R.layout.main);
// String LocalFile = "file:///android_asset/android.html";
WebView webView = (WebView) findViewById(R.id.webView1);
String html = "<embed src=\"file:///android_asset/"
+ "android.html"
+ " \"play=\"true\" loop=\"true\" width=\"100%\" height=\"100%\"> <embed>";
webView.getSettings().setPluginState(WebSettings.PluginState.OFF);
webView.getSettings().setPluginsEnabled(true);
webView.getSettings().setAllowFileAccess(true);
webView.getSettings().setJavaScriptEnabled(true);
webView.loadDataWithBaseURL("file:///android_asset/", html,
"text/html", "utf-8", null);
String str = "rtmp://23.21.155.146:554/9016012507701502509011502505116016019xm150.sdp";
webView.loadUrl("javascript:passWebUrl('" + str + "')");
My Code for media player
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<style type="text/css" media="screen">
html, body{
margin:0;
padding:0;
height:100%;
}
#altContent{
width:100%;
height:100%;
}
</style>
<title>YOUR TITLE HERE!</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
<script type="text/javascript">
var flashvars = {};
function passWebUrl(url)
{
alert(url);
}
flashvars.HaloColor = "0x0086db";
flashvars.ToolTips = "true";
flashvars.AutoPlay = "true";
flashvars.VolumeLevel = "50";
flashvars.CaptionURL = "YOUR CAPTION HERE";
flashvars.Title = "YOUR TITLE HERE";
flashvars.Logo = "";
flashvars.SRC = "Here is my url link should comes from Android Activity";
flashvars.BufferTime = "5";
flashvars.AutoHideControls = "false";
flashvars.IsLive = "true";
var params = {};
params.wmode = "transparent";
params.allowfullscreen = "true";
var attributes = {};
attributes.id = "L3MP";
swfobject.embedSWF("http://media-player.cdn.level3.net/flash/v1_1_1/Level3MediaPlayer.swf", "altContent", "100%", "100%", "10.1.0","http://media-player.cdn.level3.net/flash/v1_1_1/expressInstall.swf", flashvars, params, attributes);
</script>
</head>
<body>
<div id="altContent">
<center> <BR><BR><span style="color:red"><b>Please Install Adobe Flash Player</b>
</span><BR><BR>
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</center>
</div>
</body>
</html>
</script>
</html>
For passing the value of variable from your java class to the javascript function in your html page you have to use this code. Try this:
String str = "variable_value";
webView.loadUrl("javascript:functionName('"+ str +"')");
EDIT : -
function passWebUrl(url)
{
alert(url);
}

Categories

Resources