Home/ Questions/Q 8819441
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-14T05:21:35+00:00

I created a native Android app using the Android SDK and java packages, using

  • 0

I created a native Android app using the Android SDK and java packages, using a ASP.Net Web service created by me, and it works fine. But now I want to make this cross-platform. I heard that Phonegap and jQuery Mobile will help with this, but I am still a bit confused.

  1. Is it necessary to host the HTML file that uses Javascript to work properly?
    OR
  2. Can I include the HTML and js file in my application and call the web service methods?

Can somebody please guide me?

MY Demo Code is

JAVA SCRIPT

<script type="text/javascript" charset="utf-8" src="phonegap.js"></script>
 <script src="jquery-1.7.2.min"></script>
 <script src="jquery.mobile-1.1.1.min.js"></script>
<script type="text/javascript" charset="utf-8"/></script>

<link rel="stylesheet" src="jquery.mobile-1.1.1.min.css"/>
  <script type="text/javascript">


function onDeviceReady() {}
document.addEventListener("deviceready", onDeviceReady, false);

function LoginButton_onclick() {
    $.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
    url:    "http://182.72.192.18/webservicedemo/service.asmx/HelloWorld",
    data: '{}',
    success: function(msg) {
   jsonArray = $.parseJSON(msg.d);
    var $ul = $( '<ul id="details">' );
    for(i=0; i < jsonArray.length; i++)
    {
  $("#details").append('<li id="'+i+'" name="head" >'+jsonArray[i].name+'</li>' );
} $('#details').listview('refresh');
    },
    error: function(msg) {
         alert("Error");
    }
});

</script>

HTML

<div data-role="page" id="Page1">
<h1>DEMO PAGE</h1>

<div id="DEMO"> 
<input id="LoginButton" type="button" value="GET DATA" onclick="LoginButton_onclick()" /></div>

<div id="divList" data-role="content">
<ul id="details" data-role="listview" data-inset="true"></ul>
</div>

</div>     
</body>

and my ASP.NET Web Service is

[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[System.Web.Script.Services.ScriptService]
public class Service : System.Web.Services.WebService{
JavaScriptSerializer serializer = new JavaScriptSerializer();
public Service () {}

[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public string HelloWorld() {

    List<clsDetails> deailsList = new List<clsDetails>{
    new clsDetails(1,"BOY","SCHOOL"),
    new clsDetails(2,"GIRL","COLLEGE"),
    new clsDetails(3,"MAN","OFFICE")};

    string detail = serializer.Serialize(deailsList);
    return detail;
}
}

if i host the html file along with my web-service it provide me result .
but when i try to call using a local html file from android app it fails.
i can’t figure out what went wrong.

Can anyone tell me what went wrong here?
Look here is the response i get from web-service and i parse that to JSON

HTML HOSTED ALONG WITH WEBSERVICE

phonegap.xml

<phonegap>  
<access origin="http://182.72.192.18" /> 
</phonegap>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You have to use a local html and get the server data using XHR calls to your webservice, and then show the data of your webservice in your html.

    Edit after seeing the code:

    The problem is the url. You can’t use localhost, because if you test on a device, localhost is the device, and the device doesn’t have the webservice, you have to use the local iP of your machine. http://192.168.1.XXX:1000/WebSite2/Service.asmx/HelloWorld

    Edit 2:
    I just tested your code and got it working for me, just change this.
    The jsonArray[i].Result didn’t work for me, it return undefined, but you can access to every attribute of the json object, in the example I used the name.
    And put the refresh outside the for, you only have to refresh when you finish, not every time, and put the ; at the end.

    for(i=0; i < jsonArray.length; i++)
    {
  $("#details").append('<li id="'+i+'" name="head" >'+jsonArray[i].name+'</li>' );

}
$('#details').listview('refresh');

    If it still don’t work, check if you whitelisted the domain phonegap whitelist guide

    Full working code

    <!DOCTYPE html>
<html>
    <head>
        <title>DEMO</title>
        <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>
        <title>DEMO</title>
        <script type="text/javascript" charset="utf-8">

            function LoginButton_onclick() {
                $.ajax({
                       type: "POST",
                       contentType: "application/json; charset=utf-8",
                       dataType: "json",
                       url:    "http://182.72.192.18/webservicedemo/service.asmx/HelloWorld",
                       data: '{}',
                       success: function(msg) {
                       jsonArray = $.parseJSON(msg.d);
                       var $ul = $( '<ul id="details">' );
                       for(i=0; i < jsonArray.length; i++)
                       {
                       $("#details").append('<li id="'+i+'" name="head" >'+jsonArray[i].name+'</li>' );
                       }
                       $('#details').listview('refresh');
                       },
                       error: function(msg) {
                       alert("Error");
                       }
                       });

            }


            </script>
        </head>
        <body>
            <div data-role="page" id="Page1">
                <h1>DEMO PAGE</h1>

                <div id="DEMO">
                    <input id="LoginButton" type="button" value="GET DATA" onclick="LoginButton_onclick()" /></div>

                <div id="divList" data-role="content">
                    <ul id="details" data-role="listview" data-inset="true"></ul>
                </div>

            </div>
        </body>
</html>
    • 0