Dear Friends,
I cannot make to work datagrid with webapi data into datamanager on json format.
The grid work when I used default remotedata and ej2apiservices local, but when I change url to other, for example:
https://northwind.netcore.io/orders.json
or my own nodejs webservice:
http://localhost:8090/api/pegaempresas
with this result:
[{"idEmp":1,"nomeEmp":"CICLO SOLUÇÕES DE ENGENHARIA LTDA","cidadeEmp":"Alvarães"},{"idEmp":2,"nomeEmp":"EMPRESA TESTE","cidadeEmp":null},{"idEmp":3,"nomeEmp":"PREFEITURA MUNICIPAL DE ALVARÃES","cidadeEmp":"Alvarães"},{"idEmp":4,"nomeEmp":"PREFEITURA MUNICIPAL DE CAAPIRANGA","cidadeEmp":"CAAPIRANGA"},{"idEmp":5,"nomeEmp":"FUNDAÇÃO NACIONAL DE SAÚDE","cidadeEmp":"Manaus"},{"idEmp":6,"nomeEmp":"PINHEIRO CONSTRUCOES E COMERCIO DE MATERIAIS DE CONSTRUCAO EIRELI","cidadeEmp":null},{"idEmp":7,"nomeEmp":"PREFEITURA MUNICIPAL DE SANTA ISABEL DO RIO NEGRO","cidadeEmp":"SANTA ISABEL DO RIO NEGRO"},{"idEmp":8,"nomeEmp":"CONSTRUTORA SOMA LTDA","cidadeEmp":"MANAUS"},{"idEmp":9,"nomeEmp":"SG ENGENHARIA LTDA","cidadeEmp":"MANAUS"},{"idEmp":10,"nomeEmp":"PREFEITURA MUNICIPAL DE AMATURÁ","cidadeEmp":"AMATURÁ"},{"idEmp":11,"nomeEmp":"Credencial Engenharia Ltda","cidadeEmp":"Manaus"},{"idEmp":12,"nomeEmp":"NOGUEIRA CONSTRUÇÕES LTDA","cidadeEmp":null}]
Follow my code:
index.js:
ej.base.enableRipple(window.ripple)
var hostUrl = 'http://localhost:8090/';
var data = new ej.data.DataManager({
url: hostUrl + 'api/pegaempresas/',
adaptor: new ej.data.WebApiAdaptor(),
crossDomain: true
});
var grid = new ej.grids.Grid({
dataSource: data,
allowPaging: true,
columns: [
{ field: 'idEmp', headerText: 'ID', width: 130, textAlign: 'Left' },
{ field: 'nomeEmp', headerText: 'Empresa', width: 170 },
{ field: 'cidadeEmp', headerText: 'Cidade', width: 135, textAlign: 'Left' },
],
pageSettings: { pageCount: 3 }
});
grid.appendTo('#Grid');
index.html:
<!DOCTYPE html><html lang="en"><head>
<title>EJ2 Grid</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Typescript Grid Control">
<meta name="author" content="Syncfusion">
<link rel='nofollow' href=".\resources\package\styles\material.css" rel="stylesheet">
<style>
.e-row[aria-selected="true"] .e-customizedExpandcell {
background-color: #e0e0e0;
}
.e-grid.e-gridhover tr[role='row']:hover {
background-color: #eee;
}
.e-expand::before {
content: 'e5b8';
}
</style>
<script src=".\resources\package\scripts\ej2.min.js" type="text/javascript"></script></head>
<body>
<div id="container">
<div id="Grid"></div>
</div>
<script>
var ele = document.getElementById('container');
if(ele) {
ele.style.visibility = "visible";
}
</script>
<script src="index.js" type="text/javascript"></script>
</body></html>
The same problem exists with PHP.
Could you help me???
Thanks a lot.
Francisco Furtado
