StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

POHow can I force a DatePicker to be used for input instead of the keyboard on an HTML text input inside a WebView in Android
text
Body
copied!<p>I am attempting to learn Android development and have modified a sample app that loads a web page in a WebView. The web page contains a text input. I want to use the Android DatePicker to input a value instead of the keyboard. </p> <p>The code below almost works. The DatePicker is displayed but throws an unknown error when I select a date and call loadUrl on the WebView in the onDateSet handler to update the value of the text input (end of code sample). I suspect a cross thread issue but I'm not sure. Any guidance is appreciated.</p> <pre><code>package com.freeze.android.hellowebview; import java.util.Calendar; import android.app.Activity; import android.app.DatePickerDialog; import android.app.Dialog; import android.os.Bundle; import android.view.KeyEvent; import android.webkit.WebView; import android.webkit.WebViewClient; import android.widget.DatePicker; public class HelloWebView extends Activity { WebView webview; class DateJavaScriptInterface { public void pickDate() { showDialog(0); } } public void loadScript(String script){ webview.loadUrl("javascript:(function() { " + script + "})()"); } private class HelloWebViewClient extends WebViewClient { @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { view.loadUrl(url); return true; } @Override public void onPageFinished(WebView view, String url) { loadScript("document.getElementById('trips_dateandtime').onfocus = function(){this.blur();window.DateInterface.pickDate();};"); } } /** Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); webview = (WebView) findViewById(R.id.webview); webview.setWebViewClient(new HelloWebViewClient()); webview.getSettings().setJavaScriptEnabled(true); webview.addJavascriptInterface(new DateJavaScriptInterface(), "DateInterface"); webview.loadUrl("http://127.0.0.1:8000/mileage/default/index"); } @Override public boolean onKeyDown(int keyCode, KeyEvent event) { if ((keyCode == KeyEvent.KEYCODE_BACK) && webview.canGoBack()) { webview.goBack(); return true; } return super.onKeyDown(keyCode, event); } @Override protected Dialog onCreateDialog(int id) { switch (id) { case 0: final Calendar c = Calendar.getInstance(); int mYear = c.get(Calendar.YEAR); int mMonth = c.get(Calendar.MONTH); int mDay = c.get(Calendar.DAY_OF_MONTH); return new DatePickerDialog(this, mDateSetListener, mYear, mMonth, mDay); } return null; } private DatePickerDialog.OnDateSetListener mDateSetListener = new DatePickerDialog.OnDateSetListener() { @Override public void onDateSet(DatePicker view, int year, int monthOfYear, int dayOfMonth) { loadScript("document.getElementById('trips_dateandtime').value = 'test';"); //ERROR } }; } </code></pre>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload