Hi,
below code is perfectly working as html form but when I am using in CRM as web resource or I frame that time I have got error. Error text is empty.
Please open this code as .html and you can see it is working fine.
Question
1. Ajax jquery call is supported in latest version of dynamic 365 ?
2. Please let me know if any thing wrong in this code ?
Please do needful.
Code
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link rel="stylesheet" href="cdn.datatables.net/.../jquery.dataTables.min.css" />
<link rel="stylesheet" href="maxcdn.bootstrapcdn.com/.../bootstrap.min.css" />
<link rel="stylesheet" href="cdnjs.cloudflare.com/.../font-awesome.min.css">
</head>
<body>
<button class="btn btn-info" onclick="ShowData()">Show</button>
<hr />
<table id="data" class="table table-bordered table-hover">
<thead>
<tr>
<th>ID</th>
<th>City</th>
<th>Status</th>
</tr>
</thead>
<tbody></tbody>
<tfoot>
<tr>
<th>ID</th>
<th>City</th>
<th>Status</th>
</tr>
</tfoot>
</table>
<script src="code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="maxcdn.bootstrapcdn.com/.../bootstrap.min.js"></script>
<script src="cdn.datatables.net/.../jquery.dataTables.min.js"></script>
<script>
$(document).ready(function () {
//GetData();
})
function ShowData() {
GetData();
}
function GetData() {
var url = "tech.centralindia.cloudapp.azure.com/.../City";
//debugger;
$.ajax({
type: "GET",
url: url,
dataType: "json",
contentType: 'application/json; charset=utf-8',
beforeSend: function (XMLHttpRequest) {
XMLHttpRequest.setRequestHeader("Accept", "application/json");
},
success: function (data) {
debugger;
console.log(data);
BindData(data);
},
error: function (xhr, ajaxOptions, thrownError) {
debugger;
alert(xhr.status);
alert(thrownError);
}
});
}
function BindData(data) {
$("#data").dataTable().fnDestroy();
$('#data').DataTable(
{
"aaData": data.Data
, "aoColumns": [
{ "sTitle": "ID", "mData": "CityId", className: "dt-head-center" },
{ "sTitle": "City", "mData": "CityName", className: "dt-head-center" },
{
"sTitle": "Status", "mData": "IsActive", className: "dt-head-center",
"render": function (mData, type, full, meta) {
if (mData == true) {
return '<i class="fa fa-check"></i>';
}
else {
return '<i class="fa fa-remove"></i>';
}
}
}
]
});
}
</script>
</body>
</html>