Android webview: How to change JavaScript alert title text in android webview?

Question

In my Android application I have used web view inside web view I have a button. On clicking that button I am calling a JavaScript function that JavaScript function have an alert box. In that alert title is showing (The page at "file://" says). I want to change this title to my custom text. How to change that title?

Answer 1

Here an example in Kotlin:

Also, VERY important not to forget to add result.confirm(), else your Webview will be frozen!

override fun onJsAlert(
        view: WebView,
        url: String,
        message: String,
        result: JsResult
    ): Boolean {
        val title = "yourtitle"
        val dialog: AlertDialog =
            AlertDialog.Builder(view.context).setTitle(title).setMessage(message)
                .setPositiveButton("OK",
                    { dialog, which ->
                        result.confirm()
                    }).create()
        dialog.show()
        return true
}

On a sidenote, for those people who searched for a WebViewClient() solution like me, you can use it and WebChromeClient() simultaneously, since not every override method is available in either type of browsers. Here one of the ways to do so. Add WebView.webChromeClient = ChromeClient() and:

inner class ChromeClient internal constructor() : WebChromeClient() {
//Your Methods go here
}

And just launch regular WebViewClient afterward to do stuff

WebView.webViewClient = object : WebViewClient() {
//code goes here
}

Answer 2

I have solved this problem by implementing the setWebChromeClient:

webView.setWebChromeClient(new WebChromeClient() {

    @Override
    public boolean onJsAlert(WebView view, String url, String message, final JsResult result) {
        AlertDialog dialog = new AlertDialog.Builder(view.getContext()).
                setTitle("YourAlertTitle").
                setMessage(message).
                setPositiveButton("OK", new DialogInterface.OnClickListener() {
                    @Override
                    public void onClick(DialogInterface dialog, int which) {
                        //do nothing
                    }
                }).create();
        dialog.show();
       
        return true;
    } }); 

Answer 3

MKY's answer works fine if you're only interested in alert, but if you're also interested in confirm and prompt you also need to override the onJsConfirm and onJsPrompt methods.

The only difference between alert and confirm is that for confirm you need add a setNegativeButton which calls the result.cancel() method in the lambda.

For prompt, it's a bit more complicated since you also need to add a text editor to the dialog. To do this, you need to create an EditText object and add it to the dialog using AlertDialog.Builder.setView, as explained in this answer.

It's also a good idea to set a dismiss listener using setOnDismissListener in all three dialogs, in case the dialog is dismissed in another way than clicking on a button. This can for example happen if the user clicks on the back button or if the user clicks in the background.

Here is a complete code that works for alert, confirm and prompt. Don't forget to change "Title" in all three methods to whatever title you want to have.

webView.setWebChromeClient(new WebChromeClient(){
    @Override
    public boolean onJsAlert(WebView view, String url, String message, JsResult result){
        new AlertDialog.Builder(view.getContext())
            .setTitle("Title")
            .setMessage(message)
            .setPositiveButton("OK", (DialogInterface dialog, int which) -> result.confirm())
            .setOnDismissListener((DialogInterface dialog) -> result.confirm())
            .create()
            .show();
        return true;
    }

    @Override
    public boolean onJsConfirm(WebView view, String url, String message, JsResult result){
        new AlertDialog.Builder(view.getContext())
            .setTitle("Title")
            .setMessage(message)
            .setPositiveButton("OK", (DialogInterface dialog, int which) -> result.confirm())
            .setNegativeButton("Cancel", (DialogInterface dialog, int which) -> result.cancel())
            .setOnDismissListener((DialogInterface dialog) -> result.cancel())
            .create()
            .show();
        return true;
    }

    @Override
    public boolean onJsPrompt(WebView view, String url, String message, String defaultValue, JsPromptResult result){
        final EditText input = new EditText(view.getContext());
        input.setInputType(InputType.TYPE_CLASS_TEXT);
        input.setText(defaultValue);
        new AlertDialog.Builder(view.getContext())
            .setTitle("Title")
            .setMessage(message)
            .setView(input)
            .setPositiveButton("OK", (DialogInterface dialog, int which) -> result.confirm(input.getText().toString()))
            .setNegativeButton("Cancel", (DialogInterface dialog, int which) -> result.cancel())
            .setOnDismissListener((DialogInterface dialog) -> result.cancel())
            .create()
            .show();
        return true;
    }
});