I try to add value in a datagrid.
The following code doesn't show anything in the data grid
HTML
<table id="listeRegates" class="easyui-datagrid" style="height:450px"
title="Regates/Courses chargees" iconCls="icon-save"
sortName="date" sortOrder="asc"
rownumbers="true" pagination="true"
toolbar="#tb">
<thead>
<tr>
<th field="regate" width="120" sortable="true">Regate/Course</th>
<th field="date" width="60" sortable="true">Date debut</th>
<th field="description" width="120" sortable="true">Description</th>
<th field="organisateur" width="80" sortable="true">Organisateur</th>
<th field="demo" checkbox="true" width="80" align="right" sortable="true">Demo</th>
<th field="affichage" checkbox="true" width="120" align="right" sortable="true">Affichage autorise</th>
<th field="supprimer" checkbox="true" align="center" width="60">A supprimer</th>
</tr>
</thead>
</table>
<div id="tb" style="padding:2px 5px;">
Date From: <input class="easyui-datebox" style="width:110px">
To: <input class="easyui-datebox" style="width:110px">
<a id="btn_remove" href="#" class="easyui-linkbutton" iconCls="icon-remove" plain="true">Remove record</a>
</div>
the javascript code
$(document).ready(function(){
$('#listeRegates').datagrid({
data:[{
"regate": "Régate démo 1",
"date": "2014-01-01",
"description": "Régate d'hiver dans la baie d'Hyères",
"organisateur": "Hyères Plaisance Organisation",
"demo": "1",
"affichage": "1",
"supprimer": "0"
}, {
"regate": "Régate démo 2",
"date": "2014-05-01",
"description": "Régate de printemps entre La Londe et Cavalaire",
"organisateur": "La Londe Plaisance Organisation",
"demo": "1",
"affichage": "1",
"supprimer": "0"}]
});
});
I get the following on the screen (see enclosed file datagrid.gif)
Is a problem with my format of data ?