Android webview not sending geolocation to javascript

Question

I am writing an application that get the user's location and send it to the server. I am using JavaScript and PHP for the server side. I am trying to load this app on android WebView and it not sending the location to JavaScript so that the location can be sent to the server via ajax but when i run it on my mobile device using Chrome, it work correctly. Please i need to know what i am not doing correctly. My android code are pasted below

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    myWebview = (WebView) findViewById(R.id.webview);
    WebSettings websettings = myWebview.getSettings();

    myWebview.setWebViewClient(new WebViewClient());
    websettings.setJavaScriptEnabled(true);
    websettings.setJavaScriptCanOpenWindowsAutomatically(true);
    websettings.setGeolocationDatabasePath( getFilesDir().getPath() );

    myWebview.setWebChromeClient(new WebChromeClient() {
        public void onGeolocationPermissionsShowPrompt(String origin, 
           GeolocationPermissions.Callback callback) {
            callback.invoke(origin, true, false);
        }
    });

    websettings.setAppCacheEnabled(true);
    websettings.setDatabaseEnabled(true);
    websettings.setDomStorageEnabled(true);

    myWebview.loadUrl("https://example.com/proj/");
}

I have already grand the necessary permission in the android manifest file.

<uses-permission android:name="android.permission.INTERNET" />
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />

The Code below is my JavaScript that process the location

function getLocation() {

    if (navigator.geolocation) {
      navigator.geolocation.getCurrentPosition(reportLocation, showError);

    } else { 
      $$('locationFeedbackText').innerHTML = "Geolocation is not supported by this Devide.";
    }
  }

  function showError(error) {

  switch(error.code) {
    case error.PERMISSION_DENIED:
      $$('locationFeedbackText').innerHTML = "User denied the request for Geolocation.";
      break;
    case error.POSITION_UNAVAILABLE:
      $$('locationFeedbackText').innerHTML = "Location information is unavailable.";
      break;
    case error.TIMEOUT:
      $$('locationFeedbackText').innerHTML = "The request to get user location timed out.";
      break;
    case error.UNKNOWN_ERROR:
      $$('locationFeedbackText').innerHTML = "An unknown error occurred.";
      break;
  }
}

When i click a button on the user interface, the user location is suppose to be send to the server and the success message displayed but the output message that is displaying is the message from the showError function "Location is Unavailable. Keep in mind that this app works as expected when it is loaded with chrome on my mobile device.