I have this Asp Net Core Web Api application as my backend with all the Apis that I need using default route system localhost\api\controller\id
.
(我使用默认的路由系统localhost\api\controller\id
将这个Asp Net Core Web Api应用程序作为我的所有Apis的后端。)
All Apis are working fine when calling from PostMan, but when I try to use Jquery Ajax to call them in my FrontEnd, things don't run properly.(从PostMan进行调用时,所有Apis都可以正常工作,但是当我尝试使用Jquery Ajax在FrontEnd中调用它们时,事情就无法正常运行。)
Sorry if this question looks stupid, I'm new to JavaScript so ill really appreciate your guys help!(抱歉,如果这个问题看起来很愚蠢,我是JavaScript的新手,所以非常感谢您的帮助!)
I only have got the 'Get' method to list in a table modifying the HTML with the result:
(我只有'Get'方法在用结果修改HTML的表中列出:)
$(document).ready(function () {
$('#btn-lista-alunos').click(function () {
$.ajax({
url,
type: 'GET',
dataType: 'json', // Returns JSON
success: function (response) {
$('#tabela-alunos td').remove("");
$('#info p').remove();
var sTxt = '';
$.each(response, function (index, val) {
sTxt += '<tr>';
sTxt += '<td>' + val.id + '</td>';
sTxt += '<td>' + val.nome + '</td>';
sTxt += '<td>' + val.ra + '</td>';
sTxt += '<td>' + val.curso + '</td>';
sTxt += '<td>' + val.periodo + '</td>';
sTxt += '<td>' + val.nota + '</td>';
sTxt += '<td>' + ValidaStatus(val.nota) + '</td>';
sTxt += '</tr>';
});
$('#tabela-alunos').append(sTxt);
},
error: function () {
$('#info').html('<p>Ocorreu um erro, verifique a conex?o com a api!</p>');
}
});
});
//Botao Limpar Lista
$('#btnClear').click(function () {
$('#tabela-alunos td').remove();
$('#info p').remove();
});
});
My first Html Page:
(我的第一个HTML页面:)
<!DOCTYPE html>
<html lang="pt-br">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<script src="Scripts/app.js"></script>
<link rel="stylesheet" type = "text/css" href = "Content/content.css" />
<title>Banco Alunos</title>
</head>
<body>
<header>
<h1>
<p>Banco de Alunos</p>
</h1>
</header>
<section class="sessao_botoes">
<h2>
<input onclick="location.href = 'incluir.html' ;" " id="btn-incluir" type="button" value="Incluir"/>
<input id="btn-editar" type="button" value="Editar" />
<input id="btn-excluir" type="button" value="Excluir" />
<input id="btn-lista-alunos" type="button" value="Listar Alunos" />
<input onclick="location.href = '' ;" " id="btn-incluir" type="button" value="Filtrar Alunos"/>
<input id="btnClear" type="button" value="Limpar Listagem" />
</h2>
</section>
<p><br /><br /></p>
<section>
<h3>
<table id="tabela-alunos">
<tr>
<th>ID</th>
<th>Nome</th>
<th>RA</th>
<th>Curso</th>
<th>Periodo</th>
<th>Nota</th>
<th>Status</th>
</tr>
</table>
<div id="updatemessage"></div>
<p id="info"></p>
</h3>
</section>
</body>
</html>
My Second HTML Page with the Post Form:
(我的第二个带有发布表单的HTML页面:)
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="Scripts/app.js"></script>
<title>Incluir Aluno</title>
</head>
<body>
<header>
<h1>
<p>Incluir Novo Aluno</p>
</h1>
</header>
<section>
<h2>
<form id="myForm" action="http://localhost:51700/api/Alunos" method="post">
<p>
<label>Nome: </label>
<input type="text" name="nome">
</p>
<p>
<label>RA: </label>
<input type="number" maxlength="8" name="ra">
</p>
<p>
<label>Periodo: </label>
<input type="text" name="periodo">
</p>
<p>
<label>Curso: </label>
<input type="text" name="curso">
</p>
<p>
<label>Nota: </label>
<input type="number" max="10" maxlength="4" name="nota">
</p>
<p>
<input id="btnCadastro" type="submit" value="Cadastrar">
</p>
</form>
<p>
<input onclick="location.href = 'index.html'" type="submit" value="Voltar">
</p>
</h2>
</section>
</body>
</html>
How can I use Ajax to send the form as a JSON to my BackEnd and Edit/Delete an Object Value Listed on my first page?
(如何使用Ajax将表单作为JSON发送到我的后端并编辑/删除第一页上列出的对象值?)
I already have tried quite a few things but none of that worked.(我已经尝试了很多东西,但是都没有用。)
Thanks!(谢谢!)
ask by Lucas Lucena translate from so
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…