Não consigo obeter retorno do webservice REST
21/03/2016
0
Estou tentando uma comunicação do meu cliente .html com um serviço REST que criei em ASP.NET C#. A princípio era apenas para fazer login e caso o login e senha estivesse correto redirecionava para a pagina home da minha aplicação. O problema é o seguinte minha chamada AJAX só está executando com sucesso quando debudo o .js no navegador, caso o contrário é como se não tivesse ação nenhuma vinculada ao botão. Segue o código :
Não sei por qual motivo ele nem entra na propriedade sucess do ajax ???? Me ajudem por favor.
<!DOCTYPE html>
<html>
<head>
<!-- Required meta tags-->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="theme-color" content="#2196f3">
<title>login</title>
<link rel="stylesheet" href="dist/css/framework7.material.min.css">
<link rel="stylesheet" href="dist/css/framework7.material.colors.min.css">
<link rel="stylesheet" href="dist/css/my-app.css">
</head>
<body>
<!-- Views -->
<div class="views">
<!-- Your main view, should have "view-main" class -->
<div class="view view-main">
<div data-page="index" class="page">
<center><br><br><br><img src="img/logo_plantao_card.png"></center>
<!-- Login -->
<form name= "dados">
<div class="list-block">
<ul>
<li class="item-content">
<div class="item-inner">
<div class="label cartao"><b>Cartão</b></div>
<div class="item-input">
<input type="text" name="txt_cartao" id="txt_cartao" placeholder="Numero do Cartão"></input>
</div>
</div>
</li>
<li class="item-content">
<div class="item-inner">
<div class="label cartao"><b>Senha</b></div>
<div class="item-input">
<input type="password" name="txt_senha" id="txt_senha" placeholder="Senha"></input>
</div>
</div>
</li>
</ul>
</div>
<p class="button-rows">
<input type="submit" id="btnEntrar" class="button button-big button-fill color-blue " value="Entrar" onclick="verifica_cartao()"></input>
</p>
</form>
<!-- Roda pé-->
<div class="rodape">
Copyright © 2016 BTI - Todos os direitos reservados
</div>
</div>
</div>
</div>
<script type="text/javascript" src="dist/js/framework7.min.js"></script>
<script type="text/javascript" src="dist/js/my-app.js"></script>
<!-- <script src="https://code.jquery.com/jquery-2.2.1.min.js" integrity="sha256-gvQgAFzTH6trSrAWoH1iPo9Xc96QxSZ3feW6kem+O00="crossorigin="anonymous">
</script> -->
<script src="js/jquery.js"></script>
<script type="text/javascript">
$(document).on("click", "#btnEntrar", function(evt)
{
$.ajax({
type: "POST",
url: "http://localhost:13383/api/cartao",
success: function (data) {
//window.open('home.html');
alert('ola');
}
});
});
</script>
</body>
</html>
Não sei por qual motivo ele nem entra na propriedade sucess do ajax ???? Me ajudem por favor.
Sidnei Junior
Curtir tópico
+ 0
Responder
Post mais votado
29/03/2016
Eu não cheguei a ver o seu back-end, mas tem uma coisa errada em sua página.
Bom, o seu botão enviar está dentro de um form, e o botão está com o tipo submit. Quando está assim, ele executa o POST do form, e não o que está no "click" de sua página. Uma solução seria retirar o form, ou não deixar ele concluir.
Irei postar sua página sem o form e de outro Web Service para você testar.
Retirei alguns arquivos para evitar requisições com erro 404. Mas aí você pode adicionar normalmente.
Bom, o seu botão enviar está dentro de um form, e o botão está com o tipo submit. Quando está assim, ele executa o POST do form, e não o que está no "click" de sua página. Uma solução seria retirar o form, ou não deixar ele concluir.
Irei postar sua página sem o form e de outro Web Service para você testar.
<!DOCTYPE html>
<html>
<head>
<!-- Required meta tags-->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="theme-color" content="#2196f3">
<title>login</title>
</head>
<body>
<!-- Views -->
<div class="views">
<!-- Your main view, should have "view-main" class -->
<div class="view view-main">
<div data-page="index" class="page">
<center><br><br><br><img src="img/logo_plantao_card.png"></center>
<!-- Login -->
<form name= "dados">
<div class="list-block">
<ul>
<li class="item-content">
<div class="item-inner">
<div class="label cartao"><b>Cartão</b></div>
<div class="item-input">
<input type="text" name="txt_cartao" id="txt_cartao" placeholder="Numero do Cartão"></input>
</div>
</div>
</li>
<li class="item-content">
<div class="item-inner">
<div class="label cartao"><b>Senha</b></div>
<div class="item-input">
<input type="password" name="txt_senha" id="txt_senha" placeholder="Senha"></input>
</div>
</div>
</li>
</ul>
</div>
<p class="button-rows">
<input type="button" id="btnEntrar" class="button button-big button-fill color-blue " value="Entrar"></input>
</p>
</form>
<!-- Roda pé-->
<div class="rodape">
Copyright © 2016 BTI - Todos os direitos reservados
</div>
</div>
</div>
</div>
<script src="https://code.jquery.com/jquery-2.2.1.min.js"></script>
<script type="text/javascript">
$(document).on("click", "#btnEntrar", function(evt)
{
console.log('cliquei aqui');
$.ajax({
type: "GET",
//url: "http://localhost:13383/api/cartao",
url: 'http://viacep.com.br/ws/01001000/json/',
success: function (data) {
//window.open('home.html');
//alert('ola');
console.log(data)
}
});
});
</script>
</body>
</html>
Retirei alguns arquivos para evitar requisições com erro 404. Mas aí você pode adicionar normalmente.
Randrade
Responder
Mais Posts
21/03/2016
William
Qual tipo de retorno está sendo enviado pelo seu WebService, JSON?
Se for acrescente na requisição AJAX 'dataType: JSON'.
Se for acrescente na requisição AJAX 'dataType: JSON'.
Responder
22/03/2016
Sidnei Junior
JSON
Fiz essas duas tentativa ...
o back-end testando pelo postman , funciona perfeitamente, porem dentro da aplicação ajax sempre entra no erro
Fiz essas duas tentativa ...
$(document).on("click", "#btnEntrar", function(evt){
// $.ajax({
// type: "POST",
// url: "http://localhost:3687/api/cartao",
// data: {
// CodImp: '6064213000000001',
// senha: '1234'
// },
// dataType: "json",
// success: function (data) {
// alert("ola");
// },
// error: function (data) {
// alert("erro");
// //alert("Não foi possivel se conectar ");
// }
// });
// });
$.ajax({
type: "POST",
url: "http://localhost:3687/api/cartao",
dataType: "json",
data: {
CodImp: '6064213000000001',
senha: '1234'
},
success: function (data) {
alert("ola");
},
error: function(data){
alert("erro");
}
});
});o back-end testando pelo postman , funciona perfeitamente, porem dentro da aplicação ajax sempre entra no erro
Responder
22/03/2016
Sidnei Junior
Para quem puder ajudar postei o código no github
https://github.com/sidneipsj/Aplicativo.PlantaoCard
dividi o projeto em frontend e backend
no frontend basicamente é só a página index.html que foi implementada. no backend criei uma pasta que contém apenas o controller que implementamos, mas também tem o projeto na integra.
https://github.com/sidneipsj/Aplicativo.PlantaoCard
dividi o projeto em frontend e backend
no frontend basicamente é só a página index.html que foi implementada. no backend criei uma pasta que contém apenas o controller que implementamos, mas também tem o projeto na integra.
Responder
23/03/2016
Sidnei Junior
Galera não consegui ainda será que alguém consegue dar um help?
Responder
Clique aqui para fazer login e interagir na Comunidade :)
