Ajax works on some Android devices and not on others

[LATER EDIT: As I understand it, the problem is with the version of Android, and not with the type of device. So my code was perfect for Android up to 4.0, not higher. The correction is in the answer.]

I have lost at least 2 days with this problem. I have few web pages packaged as an Android app. And it works fine in the browser and on my Android devices, including the Galaxy Tab 2. But not on the Nexus. I don’t have it, so I continued to make an APK and a friend. The error was in AJAX. The same code works for me, does not work for it (and few others, I don’t know their devices).

Below is a small test that I am using. As you can see, this is a mistake (this is my guess). Why doesn’t work on all Android devices? I mention that I compiled this code (other link files here http://jumpshare.com/b/57O6tH ) with Eclipse as well as with Build.PhoneGap.com. However, the same result: The APK that I get works on some devices, not others. Using * file: ///android_asset/www/import.html* did not help me. Error 404, because the file is not there. But this!

Where is the mistake? It drives me crazy:). Why does this code work fine in the browser and as an APK on my Galaxy Tab 2 (and Samsung Gio), but not on Nexus (and other devices)?

<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Test</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link href="jquery.mobile-1.2.0.min.css" rel="stylesheet"/> <script src="jquery-1.8.3.min.js" type='text/javascript'></script> <script src="jquery.mobile-1.2.0.min.js" type='text/javascript'></script> <script type='text/javascript'> //$(document).ready(function() { $(document).bind("pageinit", function(){ $("#buton").bind('click',function(){ $.mobile.showPageLoadingMsg(); $.ajax({ url:'import.html', datatype:'html', type: 'GET', success:function(html){ $.mobile.hidePageLoadingMsg(); $("#result").html(html); }, error: function(jqXHR, textStatus, errorThrown) { $("#result").html("ERRORS:"+errorThrown+"<hr>"+textStatus+"<hr>"+JSON.stringify(jqXHR)) $.mobile.hidePageLoadingMsg(); alert('Not working!!!'); } }) }); }); </script> </head> <body> <!-- Pagina de start --> <div data-role="page" id="start"> <div data-role="header" data-theme="b"> <h1>Test</h1> </div> <div data-role="content"> <button id="buton">AJAX!</button> <div id="result"></div> </div> </div> </body> </html> 
+3
android ajax jquery-mobile
source share
2 answers

I found what I need. Android 4.1 and 4.2 introduce a new method: getAllowUniversalAccessFromFileURLs

Since it does not work with APIs below 16, a few lines are required for the solution to ensure that this non-existent method does not cause errors in the previous API.

 public class MainActivity extends Activity { /** Called when the activity is first created. */ WebView webView; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); webView = (WebView) findViewById(R.id.webView); webView.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY); webView.getSettings().setJavaScriptEnabled(true); int currentapiVersion = android.os.Build.VERSION.SDK_INT; if (currentapiVersion >= android.os.Build.VERSION_CODES.JELLY_BEAN){ fixNewAndroid(webView); } webView.setWebChromeClient(new WebChromeClient()); webView.loadUrl("file:///android_asset/www/index.html"); } @TargetApi(16) protected void fixNewAndroid(WebView webView) { try { webView.getSettings().setAllowUniversalAccessFromFileURLs(true); } catch(NullPointerException e) { } } 

}

+4
source share

Have you checked what your ajax GET returns? This is a DOM return document! And you are trying to set a document for your #result html! If you look at http://api.jquery.com/jQuery.get/ , you will see that your success function has 3 parameters:

success: function (data, textStatus, jqXHR) {}

Now you can choose how to get your html and display it in $ ("# result").

$ ("#result") HTML (jqXHR.responseText).

0
source share

All Articles