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. first

Answer 1

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:

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.