How to show android alert dialog in Webview?

Question

I am Developing an app with webview but I don't know how to enable JavaScript to show alert dialog in webview.

I ever tried this one but it's isn't work for me. firstly,I made webview and websettings object then set following parameters.

    webSettings.setJavaScriptEnabled(true);

    webSettings.setBuiltInZoomControls(true);

    mWebView.requestFocusFromTouch();

http://stackoverflow.com/questions/8634319/how-to-set-different-title-for-alert-dialog-when-webview-page-is-loaded — Raghunandan, May 11 '13 at 05:39
@Ganesh: you want to show android native AlertDialog (http://developer.android.com/reference/android/app/AlertDialog.html)? — Tal Kanel, May 11 '13 at 05:41

score 24 · Accepted Answer · answered May 11 '13 at 05:46

As Per Your Code i thought you don't set following setting Webviewclient and Webcromeclient to enable Javascript in Webview.

 mWebView.setWebViewClient(new WebViewClient());
 mWebView.setWebChromeClient(new WebChromeClient());

Then you load your Html page with following code.

 mWebView.loadUrl("file:///android_asset/"+Your_Html_Page);

And This is Html part in your Webview.

<!DOCTYPE html>
<html>
<head>
    <script>
    function myFunction()
    {
        alert("Hello! I am an alert box!");
    }
    </script>
</head>
<body>

<input type="button" onclick="myFunction()" value="Show alert box" />
</body>
</html>

try this might be helpful.

Perfect. this solved an issue I was having with getting a JS alert to show, thanks a lot. — Mark Railton, Jan 24 '15 at 10:00
It's working when I add the above two line. But how can I remove the url on top of alert message. — gnganapath, Feb 24 '15 at 06:32

score 6 · Answer 2 · answered Jul 29 '16 at 11:22

It is not mandatory to use WebChromeClient if you want to display message box from JavaScript alert function. You can create interfaces between your JavaScript code and client-side Android code.

In the below example, your JavaScript code can call a method in your Android code to display a Dialog, instead of using JavaScript's alert() function. I found that this is the most convenient and widely supported way to display alerts.

Include the following classes in your Android application:

File: WebAppInterface.java

import android.content.Context;
import android.webkit.JavascriptInterface;

public class WebAppInterface {
    Context mContext;

    /** Instantiate the interface and set the context */
    WebAppInterface(Context c) {
        mContext = c;
    }

    /** Show a Message box from the web page */
    @JavascriptInterface
    public void androidAlert(String message) {
        DialogBox dbx = new DialogBox();
        dbx.dialogBox(message, "I get it", "",mContext);
    }
}

File: DialogBox.java

import android.app.AlertDialog;
import android.app.Dialog;
import android.content.Context;
import android.content.DialogInterface;

public class DialogBox {    
    public boolean dialogBox(String msg, String okButton, String cancelButton, final Context activity) {
        Dialog v = null;
        AlertDialog.Builder alertDialogBuilder = new AlertDialog.Builder(activity);
        alertDialogBuilder.setMessage(msg);
        if (okButton != "") {
            alertDialogBuilder.setPositiveButton(okButton,
                    new DialogInterface.OnClickListener() {    
                        @Override
                        public void onClick(DialogInterface arg0, int arg1) { /**/ }
                    });
        }    
        if (cancelButton != "") {
            alertDialogBuilder.setNegativeButton(cancelButton,
                    new DialogInterface.OnClickListener() {
                        @Override
                        public void onClick(DialogInterface arg0, int arg1) { /**/ }
                    });
        }

        AlertDialog alertDialog = alertDialogBuilder.create();
        alertDialog.show();
        return true;
    }    
}

Next, bind the WebAppInterface class to the JavaScript that runs in your WebView with addJavascriptInterface() and name the interface Android:

WebView mWebView = (WebView) findViewById(R.id.webview);
mWebView.addJavascriptInterface(new WebAppInterface(this), "Android");

This creates an interface called Android for JavaScript running in the WebView. At this point, your web application has access to the WebAppInterface class. Below is some HTML and JavaScript that creates a message box using the new interface when the user clicks a button:

<input type="button" value="Alert!" onClick="javascript:Android.androidAlert('It works!');" />

At the click of the button, the Android interface is used to call the WebAppInterface.androidAlert() method.

A bit of warning: Using addJavascriptInterface() allows JavaScript to control your Android application. This can be a very useful feature or a dangerous security issue. As such, you should not use addJavascriptInterface() unless you wrote all of the HTML and JavaScript that appears in your WebView.

score 1 · Answer 3 · edited Feb 03 '20 at 15:13

1

To enable JavaScript dialogue on your webview, you can try this answer

edited Feb 03 '20 at 15:13

Shiny

4,945
3
17
33

answered Aug 28 '17 at 11:55

Tarit Ray

944
12
24

score 0 · Answer 4 · answered May 11 '13 at 05:41

Try this code:

public OnClickListener imageButtonViewOnClickListener = new OnClickListener() {
public void onClick(View v) {

LayoutInflater inflater = LayoutInflater.from(MyActivity.this);

// error here
View alertDialogView = inflater.inflate(R.layout.alert_dialog_layout, null);

WebView myWebView = (WebView) findViewById(R.id.DialogWebView);
myWebView.loadData(webContent, "text/html", "utf-8");
AlertDialog.Builder builder = new AlertDialog.Builder(MyActivity.this);
builder.setView(alertDialogView);

builder.setPositiveButton("OK", new DialogInterface.OnClickListener() {
    public void onClick(DialogInterface dialog, int which) {
        dialog.cancel();
    }
}).show();
}
};

XML:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:orientation="vertical">

<WebView android:id="@+id/DialogWebView" android:layout_height="wrap_content"
android:layout_width="fill_parent" android:layout_marginLeft="20dip"
android:layout_marginRight="20dip"
android:textAppearance="?android:attr/textAppearanceMedium" />

score 0 · Answer 5 · answered May 11 '13 at 05:45

0

If u want to show a native AlertDialog from an event in WebView, then this is what u r looking for Binding JavaScript code to Android code.

The sample code is available on this link..The example there show a Toast..u can show an AlertDialog insted.

answered May 11 '13 at 05:45

bakriOnFire

2,685
1
15
27

How to show android alert dialog in Webview?

5 Answers5

Linked