django datatables manytomany field serverside processing

Question

In my Django project, I am using the datatables.net jquery plugin to display some of the data from my Django models in a table. I am using this to do the serverside processing. Everything works well, but I have to display some data from another table that is linked to the first table using Django's manytomany field. Currently it shows 'appname.Location.None' in every row of the datatable.

models

class Location(models.Model):
    location = models.CharField(max_length=200000, blank=True, null=True)
    lat = models.FloatField(blank=True, null=True)
    long = models.FloatField(blank=True, null=True)

    def __str__(self):
        return self.location

class Event(models.Model):
    name = models.CharField(max_length=200, blank=True, null=True)
    is_active = models.BooleanField(default=True)
    status = models.CharField(max_length=100, blank=True, null=True)
    types = models.CharField(max_length=500000, blank=True, null=True)
    impact = models.CharField(max_length=500000, blank=True, null=True)
    loc = models.ManyToManyField(to=Location, related_name='loc', blank=True)

    def __str__(self):
        return self.name

views

class events(BaseDatatableView):
    columns = ['name', 'status', 'impact', 'types', 'id', 'loc']
    order_columns = ['name', 'status', 'impact', 'types', 'id', 'loc']

    def get_initial_queryset(self):
        return Event.objects.filter(is_active=True)

script

$(document).ready(function () {
                            $('#tableid').DataTable({
                                "processing": true,
                                "serverSide": true,
                                "ajax": "{% url 'evnts' %}",  //goes to class evnts
                                columns: [
                                    {
                                        data: 'name',                                        
                                    },
                                    {
                                        data: 'status',                                       
                                    },
                                    {
                                        data: 'impact',                                       
                                    },
                                    {
                                        data: 'types',                                   
                                    },
                                    {
                                        data: 'id',                                       
                                    },
                                    {
                                        data: 'loc'
                                    }
                                ]
                            });
                        });

What am doing wrong?

Answer 1

I had to change my views a bit and the script a bit and I could get it to work.

views

class events(BaseDatatableView):
    columns = ['name', 'status', 'impact', 'types', 'id', 'loc']
    order_columns = ['name', 'status', 'impact', 'types', 'id', 'loc']

    def get_initial_queryset(self):
        return Event.objects.filter(is_active=True)
        def prepare_results(self, qs):
        data = []
        for item in qs:
            loc = []
            for loca in item.loc.all():
                loc.append(loca.location)
            loc = ' '.join(loc)
            data.append([
                item.name,
                item.status,
                item.impact,
                item.types,
                item.id,
                loc
            ])
        return data

i have to replace columns with

columnDefs: [
                                    {
                                        targets: '0',
                                        name: 'name',                                       

                                    },
                                    {
                                        targets: '1',
                                        name: 'status',                                       
                                    },
                                    {
                                        targets: '2',
                                        name: 'impact',                                       
                                    },
                                    {
                                        targets: '3',
                                        name: 'types',                                       
                                    },
                                    {
                                        targets: '4',
                                        name: 'id',
                                    },
                                    {
                                        targets: '5',
                                        name: 'loc',                                      
                                    }
                                ]

in my scripts and the targets refers to the class names of <th> tag of the table. Example

<th class="0">Name</th>