Question

0

118

Views

Android[Kotlin] - ERROR TypeError: ["Android"].showToast is not a function

I am loading the webpage in webview using WebChromeClient(). The webpage has a dropdown whenever the user select's item from that dropdown I need to show a toast. For this, I'm following official doc I've implemented the same as the doc says. still, I'm getting the error in the console. "showToast is not a function".

In Fragment:

override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
    super.onViewCreated(view, savedInstanceState)
    val webSettings = webView.settings
    webSettings.javaScriptEnabled = true
    webSettings.domStorageEnabled = true
    webSettings.databaseEnabled = true
    webView.addJavascriptInterface(WebAppInterface(requireContext()), "Android")

    webView.webChromeClient = object : WebChromeClient() {
        override fun onConsoleMessage(consoleMessage: ConsoleMessage): Boolean {
            Log.i(TAG, consoleMessage.message())
            return true
        }

        override fun onProgressChanged(view: WebView?, newProgress: Int) {
            super.onProgressChanged(view, newProgress)
            if (newProgress == 100) {
                if (webView != null) {
                    webView.settings.builtInZoomControls = true
                    webView.settings.displayZoomControls = false
                    webView.loadUrl("javascript:loadMobileDashboard($data);")
                }
            }
        }
    }
    webView.loadUrl(url)
}

WebAppInterface:

class WebAppInterface(private val context: Context) {
    private val TAG = WebAppInterface::class.java.simpleName

    @JavascriptInterface
    fun showToast(toast: String) {
        Log.d(TAG, "showToast: $toast")
    }
}

I tried several changes and searched about it on the internet didn't work single solution. Please let me know what mistake am making here. Thanks :)

5 months ago · Juan Pablo Isaza

1 answers

Answer question

0

Answer question

Find remote jobs

Answer 1 · 2022-07-13T07:02:08.878Z

Create an html page in your assets folder, let's say named dropDown.html.

Copy this code into that file

<input type="dropDown" value="Hello" onClick="showToastInWebView('strMsg')" />

<script type="text/javascript">
    function showToastInWebView(toast) {
        Android.showToast(toast);
    }
</script>

Now load url like this

myWebView.loadUrl("file:///android_asset/dropDown.html");

Note: webView does not invoke the JS function you have added a bridge to, You need to use your own webpage(in this case which is dropDown.html) that does indeed invoke the function, either local(our case) or on the web.