How can I pass the data from Django to a Shield UI Grid? - json

Question

I'm new using Django and Shield UI, what I'm trying to do is trying to get data for a shieldGrid, making a request to get remote data from the server. I have the next code.
this is my .js
$("#id_table_diagnosticos").shieldGrid({
dataSource: {
remote: {
read: {
url: "/atender/ListadoDiagnosticos/",
dataType: "json",
operations: ["sort", "skip", "take"],
data: function (params) {
var odataParams = {};
if (params.sort && params.sort.length) {
odataParams["$orderby"] = window.orderFields[params.sort[0].path].path + (params.sort[0].desc ? " desc" : "");
}
if (params.skip != null) {
odataParams["skip"] = params.skip;
}
if (params.take != null) {
odataParams["top"] = params.take;
}
return odataParams;
}
}
},
schema: {
data: "fields",
total: function (result) {
return result["odata.count"];
},
fields: window.orderFields = {
// "pk": { path: "pk" },
"descripcion": { path: "descripcion" },
"codigo": { path: "codigo" },
}
}
},
paging: true,
sorting: true,
columns: [
// { field: "pk", title: "ID", width: 80 },
{ field: "descripcion", title: "Descripción", width: 180 },
{ field: "codigo", title: "Código", width: 100 },
]
});
});
my model.py is
class ParametrosDiagnosticos(models.Model):
descripcion=models.CharField(max_length=1000)
codigo=models.CharField(max_length=100)
sexo=models.CharField(max_length=10,default='Ambos')
estado=models.CharField(max_length=100, default='Activo')
estado_logico=models.IntegerField(default=1)
and my view.py
def ListadoDiagnosticos(request):
if request.user.is_authenticated:
if request.method=='GET' and request.is_ajax():
objeto=ParametrosDiagnosticos.objects.all()
data = serializers.serialize('json', objeto, fields=('pk','descripcion','codigo'))
return JsonResponse(data,safe=False);
The request to server is doing ok, the problem is that when I return the data, I get the next error on the console of my browser.
shieldui-all.min.js:4 Uncaught TypeError: Cannot read property 'map' of undefined
at e (shieldui-all.min.js:4)
at init.fields (shieldui-all.min.js:5)
at init.process (shieldui-all.min.js:5)
at init._success (shieldui-all.min.js:5)
at e (bundled.js:2)
at Object.z.func.i.success (shieldui-all.min.js:4)
at j (bundled.js:2)
at Object.fireWith [as resolveWith] (bundled.js:2)
at x (bundled.js:5)
at XMLHttpRequest.b (bundled.js:5)
Thank you for your help.

Answer 1

Make sure your Grid's dataSource.schema is configured correctly. Documentation about it can be found here.
For example, if your data returned from the server contains a list of objects, you do not need to set its data property.