I'm trying to pass a JSON array of integers but getJSON is not reading it. (it reads fine when I use a dummy JSON array found here https://jsonplaceholder.typicode.com/users)
Tried adding ?callback=? to deal with the CORS based on the suggestion here (Changing getJSON to JSONP) since my api is in another project.
Issues encountered:
- callback not working with getJSON (i.e. HTML table shown but still not populated.)
- following error was thrown but I'm not sure if they are related.
jquery.dataTables.min.css.: Uncaught SyntaxError: Unexpected token {
JSON array api
// GET api/dbretrieve
[HttpGet]
public ActionResult<IEnumerable<string>> Get()
{
//TEST
HashSet<int> db = new HashSet<int>() { 2, 3, 5, 7, 11, 13 };
string json_string = "";
json_string = json_string + '[';
foreach (int s in db)
{
json_string = json_string + "{pid:" + s + "},";
}
if(Data.db.Count>0) json_string = json_string.Substring(0, json_string.Length - 1);
json_string = json_string + ']';
var json = JsonConvert.DeserializeObject(json_string);
return StatusCode(200, json);
}
getJSON
<script>
$(document).ready(function () {
$.getJSON("https://localhost:44399/api/dbretrieve?callback=?", function (data) {
var employee_data = '';
$.each(data, function (key, value) {
employee_data += '<tr>';
employee_data += '<td>' + '</td>';
employee_data += '<td>' + value.pid + '</td>';
employee_data += '</tr>';
});
$('#employee_table tbody').append(employee_data);
});
});
</script>
JSON array being passed
[{"pid":2},{"pid":3},{"pid":5},{"pid":7},{"pid":11},{"pid":13}]
HTML
<body>
<div class="container">
<div class="table-responsive">
<h1>Testing of database table</h1>
<br />
<table class="table table-bordered table-striped"
id="employee_table">
<thead>
<tr>
<th>#</th>
<th>pid</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
</div>
<form id="form1" runat="server">
<div>
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
</form>
</body>
Headers for HTML
<head runat="server">
<title>JSON data to HTML</title>
<script src="Scripts/jquery-3.0.0.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/d3js/5.9.0/d3.min.js"></script>
<script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
<script src="Scripts/bootstrap.min.js"></script>
<link href="Content/bootstrap.min.css" rel="stylesheet" />
<script src="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css"></script>
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</head>
from JSON array not being read by getJSON
No comments:
Post a Comment