Javascript 如何使用Jquery使用Asp.NETCore中的API
我将此Asp Net Core Web Api应用程序作为后端，包含使用默认路由系统Javascript 如何使用Jquery使用Asp.NETCore中的API,javascript,jquery,html,.net,asp.net-core,Javascript,Jquery,Html,.net,Asp.net Core,我将此Asp Net Core Web Api应用程序作为后端，包含使用默认路由系统localhost\Api\controller\id所需的所有Api。从PostMan调用时，所有API都可以正常工作，但当我尝试在前端使用jQueryAjax调用它们时，事情并没有正常运行。抱歉，如果这个问题看起来很愚蠢，我是JavaScript新手，所以我非常感谢你们的帮助 我只在表中列出了“Get”方法修改HTML，结果如下： $(document).ready(function () { $('
localhost\Api\controller\id$(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();
});
});
$（文档）.ready（函数（）{
$（'#btn lista alunos'）。单击（函数（）{
$.ajax({
网址，
键入：“GET”，
数据类型：“json”，//返回json
成功：功能（响应）{
$（'tabela alunos td'）。删除（“”）；
$（'#info p'）。删除（）；
var sTxt=''；
$。每个（响应、函数（索引、val）{
sTxt+=''；
sTxt+=''+val.id+''；
sTxt+=''+val.nome+''；
sTxt+=''+val.ra+''；
sTxt+=''+val.curso+''；
sTxt+=''+val.periodo+''；
sTxt+=''+val.nota+''；
sTxt+=''+有效状态（val.nota）+''；
sTxt+=''；
});
$（'tabela alunos'）。追加（sTxt）；
},
错误：函数（）{
$（'info'）.html（'Ocorreu um erro，verifyque a conexão com a api！'）；
}
});
});
//博托林巴利斯塔酒店
$（'#btnClear'）。单击（函数（）{
$（'tabela alunos td'）。删除（）；
$（'#info p'）。删除（）；
});
});
<!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>
阿卢诺斯银行
阿卢诺斯银行
身份证件
诺姆
类风湿关节炎
库索
周期
诺塔
地位
<!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>
包括阿鲁诺
包括新阿鲁诺
诺姆：
RA:
周期：
库索：
注：
第一件事是为什么使用HTML页面而不是asp.net核心cshtml页面？框架提供的页面有很多特性，比如模型绑定 您可以使用jquery从html页面获取值，然后使用Ajax将数据发布到服务器端：
var data = {
StartDate: "1/19/2016",
EndDate: "4/19/2016",
ProductType: "New",
Count: 1
};
$.ajax({
url: '/Home/Edit',
type: 'POST',
data: JSON.stringify(data),
contentType: 'application/json; charset=utf-8',
success: function (data) {
window.location.href = "";
}
});
window.location.hrefFromBodypublic IActionResult Edit([FromBody]MyViewModel myViewModel)
{
if (ModelState.IsValid)
{
}
return Json("OK");
}
public class MyViewModel {
public DateTime StartDate { get; set; }
public DateTime EndDate { get; set; }
public string ProductType { get; set; }
public int Count { get; set; }
}
这是有意为之的，我在如何使不同场景中的系统在它们之间进行数据通信方面受到启发。现在一切都好了。谢谢！
public IActionResult Edit([FromBody]MyViewModel myViewModel)
{
if (ModelState.IsValid)
{
}
return Json("OK");
}
public class MyViewModel {
public DateTime StartDate { get; set; }
public DateTime EndDate { get; set; }
public string ProductType { get; set; }
public int Count { get; set; }
}