Django-datatable-view X-editable internal server error

Question

I have been struggling with this one for a couple of days now. I would like to use django-datatable-view's xeditable columns integration. My code loads the datatable correctly (see here) but whenever I specify the columns to make_xeditable, I get an 500 Internal Server error. I have looked at the few pages (Can't post links due to not enough rep...) that discuss django-datatable-view but none of them discuss the x-editable option.

Using the snippets from the live demo online (here) (version 0.7) just doesn't do anything. The table loads but the column isn't editable.

class PriceListDataTableView(XEditableDatatableView):
    model = PriceList
    datatable_options = {
        'columns': [
            'id',
            'date',
            'product',
            'unit',
            ("Price", 'price', helpers.make_xeditable),
        ]
}

I got the latest version (0.9) running on my localhost, and their example works! But I can't get it to work in my own app. Both setups run django 1.8

Here is my model:

class PriceList(models.Model):

    # Fields
    date =    models.DateField(verbose_name="Price list date")
    product = models.CharField(verbose_name="Product name", max_length=100)
    unit =    models.CharField(verbose_name="Unit", max_length=6)
    price =   models.DecimalField(verbose_name="Price", decimal_places=2, 
              max_digits=10)

Here is my template:

{% extends "agrichem/base.html" %}
{% block content %}

<script>
$(document).ready(function() {
    <!-- Initialization for x-editable tables -->
    $.fn.editable.defaults.mode = 'inline';
    $(function(){
        var xeditable_options = {};
        datatableview.initialize($('.datatable'), {
               fnRowCallback: datatableview.make_xeditable(xeditable_options),
        });

    });
});
</script>

{{ datatable }}

{% endblock %}

Here is my view:

class PriceListDataTableView(XEditableDatatableView):
    model = PriceList

    class datatable_class(Datatable):
        class Meta:
            columns = ['id', 'date', 'product', 'unit', 'price']
            processors = {
                'price': helpers.make_xeditable,

            }

If I remove the processors block, my table loads, but not editable. With it in, I get a pop-up that says:

DataTables warning: table id=DataTables_Table_0 - Ajax error. For more information about this error, please see datatables.net/tn/7

This pop-up error is sent whenever the server doesn't return a 2xx code, so it basically happens because of the following bit:

In the console I get a 500 Internal Server error(sabotaged coz of link count):

jquery.min.js:4 GET ht__tp://127.0.0.1:8000/pricelist/?draw=1&columns%5B0%5D%5Bdata%5D=0&columns%art=0&length=25&search%5Bvalue%5D=&search%5Bregex%5D=false&_=1497779941842 500 (INTERNAL SERVER ERROR)

I am going in circles now, I need some help. Anybody got this working?

Edit: I have now downgraded django-datatable-view to version 0.8, and used the syntax suggested suggested below, and I get the SAME 500 Internal Server error for this too. I suspect I am missing some essential setup step somewhere, but the documentation, such as it is, doesn't say what.

Answer 1

After much frustration and going in circles I gave up on django-datatable-view. I could not get it to work for inline editing, which was my primary requirement.

I then found django-inplaceedit. It works a charm and is everything I need.

I render my table in the template like so:

{% extends "site_base.html" %}


{% block more_extra_script %}

    {% load inplace_edit %}
    {% inplace_css 0 %}
    {% inplace_js 1 0 %}

{% endblock more_extra_script %}


{% block content %}

<div class="container-fluid">
    <p><a class="btn btn-default" href="{% url 'pricelist_list' %}">PriceList Listing</a></p>

    <h2>Pricelist for {{ pricelist_date }}</h2>
    <p>Double-click a price to edit it</p>

    <table class="table table-responsive table-striped .table-bordered .table_hover">
      <thead class="info">
          <th>Product</th>
          <th>Unit</th>
          <th>Price</th>
      </thead>
      <tbody>
          {% for prod in products %}
              <tr>
                  <td>{{prod.product}}</td>
                  <td>{{prod.unit}}</td>
                  <td>{% inplace_edit "prod.price" %}</td>
              </tr>
          {% endfor %}
      </tbody>
    </table>

</div>
{% endblock %} 

The beauty of this app is that it handles all the server-side stuff transparently. You double-click the field, change it, press enter, and the value gets updated in the database.