webview date picker works in android emulator but not on device?

Question

I've used the code example posted here calling date picker from javascript and this works fine in the android emulator. When I click on the date input box in web view, the android date picker appears and I can select it.

However, when I test this on my device, I just get a standard text input field it is as though the method is not being called. Does anyone have any suggestions? The full code I am using is:

public class MainActivity extends ActionBarActivity {

  public  WebView mWebView;

    @Override
    protected void onCreate (Bundle savedInstanceState){
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    mWebView = (WebView) findViewById(R.id.activity_main_webview);
    WebSettings webSettings = mWebView.getSettings();
    webSettings.setJavaScriptEnabled(true);

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

    mWebView.loadUrl("http:// mywebsite.html");
}

    // Classe de prise en charge du java privé
    public class MyJavaScriptInterface {
        public String m_szTagId;

        Context mContext;

        MyJavaScriptInterface(Context c) {
            mContext = c;
        }

        public void openDatePickerDialog(String szTagId) {
            m_szTagId = szTagId;
            Calendar c = Calendar.getInstance();
            DatePickerDialog dp = new DatePickerDialog(mContext, new OnDateSetListener() {
                public void onDateSet(DatePicker view, int year,
                                      int monthOfYear, int dayOfMonth) {
                    String szDate = String.format("%04d/%02d/%02d", year, monthOfYear + 1, dayOfMonth);
                    mWebView.loadUrl("javascript:callFromActivity_RetDate(\"" + m_szTagId + "\", \"" + szDate + "\")");
                }
            }, c.get(Calendar.YEAR), c.get(Calendar.MONTH), c.get(Calendar.DAY_OF_MONTH));
            dp.show();
        }

    } // Class MyJavaScriptInterface


    @Override
    public boolean onCreateOptionsMenu (Menu menu){
    // Inflate the menu; this adds items to the action bar if it is present.
    getMenuInflater().inflate(R.menu.menu_main, menu);
    return true;
}

    @Override
    public boolean onOptionsItemSelected (MenuItem item){
    // Handle action bar item clicks here. The action bar will
    // automatically handle clicks on the Home/Up button, so long
    // as you specify a parent activity in AndroidManifest.xml.
    int id = item.getItemId();

    //noinspection SimplifiableIfStatement
    if (id == R.id.action_settings) {
        return true;
    }

    return super.onOptionsItemSelected(item);
}
}

and the Javascript code is:

 // ---- date picker to call methods of the android device $('#datepicker').click(function(e){ getDataDate(); }); function getDataDate(){ MSSAndroidFunction.openDatePickerDialog('datepicker'); } function callFromActivity_RetDate(datepicker, data) { document.subHours.datepicker.value = data; } 

Answer 1

You have named your JavaScript Interface as MyJavaScriptInterface , so you must call it from JavaScript.

Ie:

Instead of MSSAndroidFunction.openDatePickerDialog('datepicker') , you must do MyJavaScriptInterface.openDatePickerDialog('datepicker') , in a JavaScript method.

I have a WebView based application, in which I define the Interface in another class, not an inner class, and in the initialization I do:

htmlInterface=new HTMLInterface(this, webView);
webView.addJavascriptInterface(htmlInterface, "Android");

Hope it helps you
Regards