Here's the code:
<!DOCTYPE html>
<html>
<head>
<title>User2</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" />
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script>
<script>
$(document).ready(function() {
$.support.cors = true;
//Uses Tasty Pie REST APIs
$("#user2-adduser2").click(function() {data = JSON.stringify({"username":$("#user2-username").val() === ""? null:$("#user2-username").val(), "product":$("#user2-product").val() === "" || $("#user2-product").val() === "Option(s)"? null:$("#user2-product").val()})
$.ajax({
url: 'http://xxxxxxdomainxxxxx/api/v1/user2/?format=json',
type: 'POST',
async: false,
contentType: 'application/json',
data: data,
dataType: 'json',
processData: false,
success: function(data){
alert("Done!")
//Goto Next Page
},
error: function(jqXHR, textStatus, errorThrown){
alert("Some Error!")
}
})
});
////For Dynamically loading dropdown options
$.ajax({
type: 'GET',
url: 'http://xxxxxxdomainxxxxx/api/v1/productapp/?format=json',
accepts: 'application/json',
success: function(data){
var options = '<option>Option(s)</option>'
for(var i = 0; i < data.objects.length; ++i) {
var str = '<option value="/api/v1/productapp/' + data.objects[i].id + '/">' + data.objects[i].productname + '</option>'
options=options+str
}
$('#user2-product').html(options).selectmenu("refresh");
},
dataType: "json"
});
});// end of document.ready function
</script>
</head>
<body>
<div id="user2">
<h1>User2</h1>
<div id="user2-username-div">
username:
<input type="text" id="user2-username">
</div>
<div id="user2-product-div">
Product:
<select id="user2-product" data-native-menu="false"></select>
</div>
<a id="user2-adduser2" href="#" data-role="button">Add User2</a>
</div>
</body>
</html>
The problem exists for android browser alone. All the static contents of the page are loading. However any dynamic content, that is in this case, the options for the drop-down coming from server are not loaded. If you just refresh browser once, everything works fine.
Have tried almost everything today but no luck. Any advise/help is highly appreciated.
