Question

I’m trying to follow the documentation for django-selectable
http://django-selectable.readthedocs.org/en/version-0.6.2/quick-start.html

I have setup everything from what I can tell correctly, however nothing in FireBug even seems to fire/load. It does not seem to be doing the lookup at all. Below is my code any errors spotted?

models.py

class Event(models.Model):
    event_id = models.IntegerField(primary_key=True)
    name = models.CharField(max_length=80,blank=False)
    date = models.DateField()
    start = models.TimeField()
    end = models.TimeField()

    category = models.ForeignKey(Category)
    city = models.ForeignKey(City)
    user = models.ForeignKey(User)

    def __unicode__(self):
        return self.name

lookup.py

from selectable.base import ModelLookup
from selectable.registry import registry

from events.models import Event


class EventLookup(ModelLookup):
    model = Event
    search_field = 'city__icontains'
    filters = {'active': True, }

    def get_item_value(self, item):
        # Display for currently selected item
        return item.name

    def get_item_label(self, item):

        return u"%s (%s)" % (item.name)

registry.register(EventLookup)

forms.py

from django import forms
from django.forms import ModelForm
from events.models import Event
import selectable.forms as selectable
from events.lookups import EventLookup


class EventForm(ModelForm):
    autocomplete = forms.CharField(
        label='Type the name of a fruit (AutoCompleteWidget)',
        widget=selectable.AutoCompleteWidget(EventLookup),
        required=False,
    )

    class Meta:
        model = Event

urls.py

 (r'^selectable/', include('selectable.urls')),

template.html

    **the following is loaded in correctly...**
    jquery-1.9.0.js
    jquery-ui-1.10.0.custom.min.css
    jquery.ui.core.js
    jquery.ui.widget.js
    jquery.ui.datepicker.js
    jquery.ui.autocomplete.js

**then I just output {{ form }}** 

---

No other js is being loaded on the page. just the above js and the form. any ideas? have I missed something?

Answer 1

The output of {{ form }} contains the HTML for each of the form inputs but it does not render any media defined by the form. The documentation notes that you must include the media define by the selectable widgets.

The widgets in django-selectable define the media they need as
described in the Django documentation on Form Media. That means to
include the javascript and css you need to make the widgets work you
can include {{ form.media.css }} and {{ form.media.js }} in your
template.