CODEWITHSUNDEEP
extjscordovasencha-touchsencha-touch-2
user1315906
user1315906

Reputation: 3494

How to alert the user when there's no internet connection

I need to alert the user with the following conditions;

  1. Request timed out
  2. No internet connection
  3. Unable to reach the server

Here's the code; How to capture the following conditions when occurred and alert the user ?

failure: function (response) {
    var text = response.responseText;
    console.log("FAILED");
},success: function (response) {
    var text = response.responseText;
    console.log("SUCCESS");
}

I tried the following code to check if the internet is reachable, but it didn't work

var networkState = navigator.network.connection.type
    alert(states[networkState]);
    if (networkState == Connection.NONE){
        alert('No internet ');
    };

UPDATE **

I added the following in my index.html, but, when i disable WIFI, i don't see the alert popping. 

<script>
function onDeviceReady() {
    document.addEventListener("offline", function() {
        alert("No internet connection");
    }, false);
}
</script>

Upvotes: 6

Views: 13762

Answers (5)

JOB
JOB

Reputation: 85

Just Embed this in your tag

<body onoffline="alert('PLEASE CHECK YOUR INTERNET SETTING');">

Upvotes: 0

Gaurav Vachhani
Gaurav Vachhani

Reputation: 11

You can add 'Ext.device.Connection' in app.js of your application. And check your device is online or offline using code:

if (Ext.device.Connection.isOnline()) {
         alert('Connected to internet');
      }
      else{
         alert('You are not connected to internet');
      }

Upvotes: 1

Grgur
Grgur

Reputation: 7382

Exactly as Simon said, you can use 

document.addEventListener("offline", youCallbackFn, false);

or you can interrogate the boolean property

navigator.onLine

(Should return true or false)

However, this technique will tell you whether device is connected. The caveat is such that device can be connected to WiFi, but the router might be offline. In that case, use a polling mechanism, like timely Ext.Ajax.request with lower timeouts. Timeout expired = offline.

Upvotes: 3

Simon MacDonald
Simon MacDonald

Reputation: 23273

The best thing to do is to listen to the "offline" event. When you get the offline event you can warn your user and take whatever steps necessary to save data, etc.

For instance, your "deviceready" callback:

document.addEventListener("offline", function() {
    alert("No internet connection");
}, false);

This code should work for most all versions of PhoneGap. It's been in since at least the 1.0 release.

Upvotes: 19

Saurabh Gokhale
Saurabh Gokhale

Reputation: 46395

You can use PhoneGap's NETWORK API

The network object gives access to the device's cellular and wifi connection information.

You can test it in the following way,

 function onDeviceReady() {
        navigator.network.isReachable("phonegap.com", reachableCallback, {});
    }

 // Check network status
 //
 function reachableCallback(reachability) {
     // There is no consistency on the format of reachability
     var networkState = reachability.code || reachability;
     var states = {};
     states[NetworkStatus.NOT_REACHABLE]  = 'No network connection';
     states[NetworkStatus.REACHABLE_VIA_CARRIER_DATA_NETWORK] = 'Carrier data connection';
     states[NetworkStatus.REACHABLE_VIA_WIFI_NETWORK] = 'WiFi connection';

     alert('Connection type: ' + states[networkState]);
  }

Upvotes: 1

Related Questions