Android studio load javascript function from file in sd card

Question

I am working with android application where this app will write file html in sd card. Then, load the file in web view. The apps can load html file but the javascript function in html file not working properly. Below is my code that I working on.

public class WriteWebPage extends AppCompatActivity {

Button btn;
WebView wb;

private String fileName = "SampleFile.html";
private String filePath = "/sdcard/";
File myExternalFile;
String myData = "";

@SuppressLint({"JavascriptInterface", "SetJavaScriptEnabled"})
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.read_webpage);

    btn = findViewById(R.id.btn);
    wb = findViewById(R.id.wb);

    final MyJavaScriptInterface myJavaScriptInterface = new MyJavaScriptInterface(this);
    wb.addJavascriptInterface(myJavaScriptInterface, "AndroidFunction");

    wb.getSettings().setJavaScriptEnabled(true);
    wb.loadUrl("file://" + myExternalFile);

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


    btn.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {

            try {

                String a = "asd12sf";
                String html = "<html><body>" +
                        "<h3>Hello World</h3>" +
                        "<p>" + a  + "</p>" +
                        "<input type= 'button' value='button' onClick='dialog()'/>" +
                        "<script language='javascript'>" +
                        "function dialog(){" +
                        "AndroidFunction.openAndroidDialog();}" +
                        "</script>" +
                        "</body></html>";

                FileOutputStream fos = new FileOutputStream(myExternalFile);
                fos.write(html.getBytes());
                fos.close();
            } catch (IOException e) {
                e.printStackTrace();
            }

              wb.loadUrl("file://"+myExternalFile);

        }
    });

    if(isExternalStorageAvailable()){
        myExternalFile = new File(getExternalFilesDir(filePath), fileName);
    }
}

private static boolean isExternalStorageAvailable(){

    String extStorageState = Environment.getExternalStorageState();
    if(Environment.MEDIA_MOUNTED.equals(extStorageState)){
        return true;
    }
    return false;
}

private class  MyJavaScriptInterface{

    Context mContext;

    MyJavaScriptInterface(Context c){
        mContext = c;
    }
    @JavascriptInterface
    public void dialog(){
        AlertDialog.Builder myDialog = new AlertDialog.Builder(WriteWebPage.this);
        myDialog.setTitle("Danger!");
        myDialog.setMessage("Hi");
        myDialog.setPositiveButton("ON", null);
        myDialog.show();
    }
}
}

Can someone help me in order make javascript function working in apps?

Possible duplicate of [JavaScript not working in Android Webview?](https://stackoverflow.com/questions/7548172/javascript-not-working-in-android-webview) — Abhishek, May 22 '18 at 05:32
nope, I already declare setJavaScriptEnabled(true) on line 16 — zam, May 22 '18 at 05:40
I got hint AndroidFunction.openAndroidDialog(); in your html should be AndroidFunction.dialog(); — Abhishek, May 22 '18 at 05:45

score 0 · Accepted Answer · answered May 22 '18 at 05:46

you are calling function openAndroidDialog() which is not defined anywhere in Javascript interface. You have to call dialog() function

Your html

 String html = "<html><body>" +
                    "<h3>Hello World</h3>" +
                    "<p>" + a  + "</p>" +
                    "<input type= 'button' value='button' onClick='dialog()'/>" +
                    "<script language='javascript'>" +
                    "function dialog(){" +
                    "AndroidFunction.openAndroidDialog();}" +
                    "</script>" +
                    "</body></html>";

Should be

  String html = "<html><body>" +
                    "<h3>Hello World</h3>" +
                    "<p>" + a  + "</p>" +
                    "<input type= 'button' value='button' onClick='dialog()'/>" +
                    "<script language='javascript'>" +
                    "function dialog(){" +
                    "AndroidFunction.dialog();}" +
                    "</script>" +
                    "</body></html>";

Same mistake I made most of the time :) – Abhishek May 22 '18 at 06:07 — Abhishek, May 22 '18 at 06:07

Android studio load javascript function from file in sd card

1 Answers1