Solved: Vs.net WebServices or SqlServer

Cesar_Daniel_G_ · ‎05-16-2014

Hi, im starting learning to develop apps with XDK, i want know how to retrieve data from a Visual Studio .net web services (.asmx file) but cant find information on how to do this. Normaly i use Sql Server to store my data and i want know any way to retrieve data from my sql server directly from XDK or using a .net web services where will have functions to return a dataset, strings, and structured data types.

Any example will be great.

Thanks.

PaulF_IntelCorp · ‎05-29-2014

Try this version of your index.html file, please compare it to the original so you can see where all the changes are:

<!DOCTYPE html> 
<html>
<head>
<meta charset="utf-8">
<title>Aplic. Web de jQuery Mobile</title>
<link href="jquery-mobile/jquery.mobile-1.0.min.css" rel="stylesheet" type="text/css"/>
 
</head> 
<body> 
<script>
function CargaCombo() {
    /*alert("Jose si funciono");*/
    $("#categoria").empty();
    $('#mensaje').text('Entra CargaCombo');
    $.ajax({
        url: "http://190.10.122.159:81/WsClienteHut/Wsclientehut.asmx/ConsultarTSQL",
        data: {
            Tabla: 'Categorias',
            Nomllave: 'Estado',
            valllave: 1
        },
        success: function(data) {

            $('#mensaje').text('CargaCombo Success Fucntion');

            $(data).find("Categorias").each(function() {
                /*    alert("1");*/
                var valor = $(this).find("CodCategoria").text();
                var nombre = $(this).find("Nombre").text();
                $("#categoria").append("<option value=" + valor + ">" + nombre + "</option>");

            });

            $('#mensaje').text('Categorias Listas');
        }
    });
}
/*prueba de cargado de combo*/

function onDeviceReady() {
  intel.xdk.device.hideSplashScreen() ;   //hide splash screen
  $(document).ready(function() {
      // Creamos el evento change para detectar el elemento elegido
      $("#categoria").change(function() {
          $("#categoria option:selected").each(function() {
              // capturamos el valor elegido
              elegido = $(this).val();
              //      alert(elegido);
              // Llamamos al archivo combo1.php
              CargaSubCate(elegido);
          });
      })
  });
}
document.addEventListener("deviceready",onDeviceReady,false) ;

function CargaSubCate() {
    /*alert("Jose si funciono 2");*/
    $('#subcategoria').empty();
    $('#subcategoria').text('');
    var llave;
    debugger;
    llave = $('#categoria').val();

    $.ajax({
        url: "http://190.10.122.159:81/WsClienteHut/Wsclientehut.asmx/ConsultarTSQL",
        data: {
            Tabla: 'SubCategorias',
            Nomllave: 'CodCategoria',
            valllave: llave
        },
        success: function(data) {
            $('#subcategoria').empty();

            $('#mensaje').text('enter function');

            debugger;
            //  $('#mensaje').empty().text = "hola";
            $(data).find("SubCategorias").each(function() {
                /*alert("1");*/

                var valor = $(this).find("CodSubCategoria").text();
                var nombre = $(this).find("Nombre").text();
                $("#subcategoria").append("<option value=" + valor + ">" + nombre + "</option>");

            });


        }
    });
}

</script>
<div data-role="page" id="page">
	<div data-role="header">
		<h1>Página uno</h1>
	</div>
	<div data-role="content">	
		<ul data-role="listview">
			<li><a href="#page2">Servicio Web</a></li>
            <li><a href="#page3">Página tres</a></li>
			<li><a href="#page4">Página cuatro</a></li>
		</ul>		
	</div>
	<div data-role="footer">
		<h4>Pie de página</h4>
	</div>
</div>

<div data-role="page" id="page2">
	<div data-role="header">
		<h1>Servicio Web</h1>
	</div>
	<div data-role="content">
    <input type="button" value="Ver Categorías" onClick="CargaCombo()" >	
		<table>
        <td>
        <select name="categoria" id="categoria" data-mini="true" data-inline="true" onchange="CargaSubCate()">
    <option value="Seleccione">Seleccione</option>
</select>     
        </td>
        <td>
        <select name="subcategoria" id="subcategoria" data-mini="true" data-inline="true">
        
    <option value="Seleccione">Seleccione</option>
    
</select>     

        </td>
        </table>
<div id="Contenedor">
Prueba Datos MOBILE
    
    <div id="mensaje" name="name">fin</div>

</div>
	</div>
	<div data-role="footer">
		<h4>Pie de página</h4>
	</div>
</div>

<div data-role="page" id="page3">
	<div data-role="header">
		<h1>Página tres</h1>
	</div>
	<div data-role="content">	
		Contenido		
	</div>
	<div data-role="footer">
		<h4>Pie de página</h4>
	</div>
</div>

<div data-role="page" id="page4">
	<div data-role="header">
		<h1>Página cuatro</h1>
	</div>
	<div data-role="content">	
		Contenido		
	</div>
	<div data-role="footer">
		<h4>Pie de página</h4>
	</div>
</div>

<script src="intelxdk.js"></script>         <!-- phantom library, needed for XDK api calls -->
<script src="cordova.js"></script>          <!-- phantom library, needed for Cordova api calls -->
<script src="xhr.js"></script>              <!-- phantom library, needed for XDK CORS -->

<script src="jquery-mobile/jquery-1.6.4.min.js" type="text/javascript"></script>
<script src="jquery-mobile/jquery.mobile-1.0.min.js" type="text/javascript"></script>

</body>
</html>

View solution in original post

PaulF_IntelCorp · ‎05-23-2014

Your XDK app runs as a client app on a device, it does not have access to any server-side functions. You need to build a RESTful API on your server that your XDK app can then use to retrieve data, for example, using AJAX calls or similar. You can experiment using some existing services, like the Rotten Tomatoes services, by checking the Rotten Tomatoes demo app. Or experiment with the Services tab in the XDK.

Cesar_Daniel_G_ · ‎05-26-2014

I'm still looking for a way to connect to web services.
I found a way using jquery works fine on the emulator, but does NOT work onthe device. What could be happening?

Here is the code im using. all xdk project.

PaulF_IntelCorp · ‎05-29-2014

Try this version of your index.html file, please compare it to the original so you can see where all the changes are:

<!DOCTYPE html> 
<html>
<head>
<meta charset="utf-8">
<title>Aplic. Web de jQuery Mobile</title>
<link href="jquery-mobile/jquery.mobile-1.0.min.css" rel="stylesheet" type="text/css"/>
 
</head> 
<body> 
<script>
function CargaCombo() {
    /*alert("Jose si funciono");*/
    $("#categoria").empty();
    $('#mensaje').text('Entra CargaCombo');
    $.ajax({
        url: "http://190.10.122.159:81/WsClienteHut/Wsclientehut.asmx/ConsultarTSQL",
        data: {
            Tabla: 'Categorias',
            Nomllave: 'Estado',
            valllave: 1
        },
        success: function(data) {

            $('#mensaje').text('CargaCombo Success Fucntion');

            $(data).find("Categorias").each(function() {
                /*    alert("1");*/
                var valor = $(this).find("CodCategoria").text();
                var nombre = $(this).find("Nombre").text();
                $("#categoria").append("<option value=" + valor + ">" + nombre + "</option>");

            });

            $('#mensaje').text('Categorias Listas');
        }
    });
}
/*prueba de cargado de combo*/

function onDeviceReady() {
  intel.xdk.device.hideSplashScreen() ;   //hide splash screen
  $(document).ready(function() {
      // Creamos el evento change para detectar el elemento elegido
      $("#categoria").change(function() {
          $("#categoria option:selected").each(function() {
              // capturamos el valor elegido
              elegido = $(this).val();
              //      alert(elegido);
              // Llamamos al archivo combo1.php
              CargaSubCate(elegido);
          });
      })
  });
}
document.addEventListener("deviceready",onDeviceReady,false) ;

function CargaSubCate() {
    /*alert("Jose si funciono 2");*/
    $('#subcategoria').empty();
    $('#subcategoria').text('');
    var llave;
    debugger;
    llave = $('#categoria').val();

    $.ajax({
        url: "http://190.10.122.159:81/WsClienteHut/Wsclientehut.asmx/ConsultarTSQL",
        data: {
            Tabla: 'SubCategorias',
            Nomllave: 'CodCategoria',
            valllave: llave
        },
        success: function(data) {
            $('#subcategoria').empty();

            $('#mensaje').text('enter function');

            debugger;
            //  $('#mensaje').empty().text = "hola";
            $(data).find("SubCategorias").each(function() {
                /*alert("1");*/

                var valor = $(this).find("CodSubCategoria").text();
                var nombre = $(this).find("Nombre").text();
                $("#subcategoria").append("<option value=" + valor + ">" + nombre + "</option>");

            });


        }
    });
}

</script>
<div data-role="page" id="page">
	<div data-role="header">
		<h1>Página uno</h1>
	</div>
	<div data-role="content">	
		<ul data-role="listview">
			<li><a href="#page2">Servicio Web</a></li>
            <li><a href="#page3">Página tres</a></li>
			<li><a href="#page4">Página cuatro</a></li>
		</ul>		
	</div>
	<div data-role="footer">
		<h4>Pie de página</h4>
	</div>
</div>

<div data-role="page" id="page2">
	<div data-role="header">
		<h1>Servicio Web</h1>
	</div>
	<div data-role="content">
    <input type="button" value="Ver Categorías" onClick="CargaCombo()" >	
		<table>
        <td>
        <select name="categoria" id="categoria" data-mini="true" data-inline="true" onchange="CargaSubCate()">
    <option value="Seleccione">Seleccione</option>
</select>     
        </td>
        <td>
        <select name="subcategoria" id="subcategoria" data-mini="true" data-inline="true">
        
    <option value="Seleccione">Seleccione</option>
    
</select>     

        </td>
        </table>
<div id="Contenedor">
Prueba Datos MOBILE
    
    <div id="mensaje" name="name">fin</div>

</div>
	</div>
	<div data-role="footer">
		<h4>Pie de página</h4>
	</div>
</div>

<div data-role="page" id="page3">
	<div data-role="header">
		<h1>Página tres</h1>
	</div>
	<div data-role="content">	
		Contenido		
	</div>
	<div data-role="footer">
		<h4>Pie de página</h4>
	</div>
</div>

<div data-role="page" id="page4">
	<div data-role="header">
		<h1>Página cuatro</h1>
	</div>
	<div data-role="content">	
		Contenido		
	</div>
	<div data-role="footer">
		<h4>Pie de página</h4>
	</div>
</div>

<script src="intelxdk.js"></script>         <!-- phantom library, needed for XDK api calls -->
<script src="cordova.js"></script>          <!-- phantom library, needed for Cordova api calls -->
<script src="xhr.js"></script>              <!-- phantom library, needed for XDK CORS -->

<script src="jquery-mobile/jquery-1.6.4.min.js" type="text/javascript"></script>
<script src="jquery-mobile/jquery.mobile-1.0.min.js" type="text/javascript"></script>

</body>
</html>

Diego_R_2 · ‎06-04-2015

I have a similar issue.

I'm developing an App with XDK and AppFramework.

I want to call an ASP.NET WebService but it doesn't work, no error message, tha Ajax call is just ignored.

The code below works well in browser.

$.ajax({
            type: "POST",
            url: "http://192.168.0.137:87/WebMethods/Common.asmx/LogIn",
            data: '{email: "name@domain.com", password: "123456"}',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            async: false,
            success: function (response) {
                alert("success");
            },
            failure: function (response) {
                alert("failure");
            }
        })

What is wrong for XDK?

PaulF_IntelCorp · ‎06-04-2015

@Diego -- I'm guessing that you are either missing these lines in your index.html file:

<script src="intelxdk.js"></script>         <!-- phantom library, needed for XDK api calls -->
168
	<script src="cordova.js"></script>          <!-- phantom library, needed for Cordova api calls -->
169
	<script src="xhr.js"></script>              <!-- phantom library, needed for XDK CORS -->
170

Or that you have not specified a "Domain Whitelist" in the Build Settings on the Projects tab or ???. Can you provide a simple example app that reproduces the issue? Please attach it as a ZIP file that contains your ENTIRE project directory.

Diego_R_2 · ‎06-04-2015

I found the problem.

My webservice is published on port 87. Switching it to port 80 solve the issue.

Seems that Intel XDK or Cordova is not able to understand ":87".