2

I have successfully set incorporated autocomplete light into my django project. I am using it on a form and it is working as expected. I followed the quick start tutorial at https://django-autocomplete-light.readthedocs.org/en/docs_rewrite/quick.html?highlight=quick

However, the form fields that I am using an autocomplete_light.Choice widget with have their form field name changed. Specifically there is a '-autocomplete' appended to the end of what I expected to be the input form tag name.

Here is my form:

class SearchForm(forms.Form):
    #flight_from = forms.CharField(max_length=200, required=False, widget=forms.TextInput)
    flight_from = forms.ModelChoiceField(Airport.objects.all(),
        widget=autocomplete_light.ChoiceWidget('AirportAutocomplete'))
    flight_to = forms.CharField(max_length=200, required=False, widget=forms.TextInput)
    start_date = forms.DateField(required=False, input_formats='%Y-%m-%d')
    end_date = forms.DateField(required=False, input_formats='%Y-%m-%d')
    max_price = forms.FloatField(required=False, widget=forms.TextInput)

Here is my autocomplete_light_registry.py file:

import autocomplete_light

from models import Airport

class AirportAutocomplete(autocomplete_light.AutocompleteModelBase):
    search_fields = ['name_city_country_code']

autocomplete_light.register(Airport, AirportAutocomplete)

This is what the form field looks like after it is being rendered:

<label for="id_flight_from">Flight from:</label>
<span id="id_flight_from-wrapper" class="autocomplete-light-widget flight_from single" data-autocomplete-name="flight_from" data-autocomplete-placeholder="Other model name ?" data-autocomplete-choice-selector="[data-value]" data-autocomplete-url="/autocomplete/AirportAutocomplete/" data-name="flight_from" data-bootstrap="normal" data-max-values="1" data-widget-ready="1">
<span id="id_flight_from-deck" class="deck div"> </span>
<input id="id_flight_from_text" class=" autocomplete" type="text" value="" name="flight_from-autocomplete" autocomplete="off" placeholder="Other model name ?">
<select id="id_flight_from" class="value-select" multiple="multiple" name="flight_from" style="display:none"> </select>
<span class="remove div" style="display:none"> X </span>
<span class="choice-template div" style="display:none">
</span>
<div style="clear: both"></div>

As you can see, the input tag name is "flight_from-autocomplete", I want it to just be "flight_from". I have tried specifying the autocomplete_js_attributes and widget_attributes in my autocomplete_light_registry.py file like so:

autocomplete_js_attributes={'name': 'flight_from'}

and

widget_js_attributes = {'name': 'flight_from'}

but that has not chaged that input tag name attribute. Please let me know if you have any idea how to set this attribute or override the widget rendering function.

theSamMan
  • 21
  • 2
  • I was able to find a much simpler solution to what I wanted. The basic outline of what I was able to do is given in a great example here: http://www.copyandwaste.com/posts/view/jquery-ui-autocomplete-1-8-with-django-views/ – theSamMan Nov 19 '13 at 03:22

1 Answers1

0

As you can see, the input tag name is "flight_from-autocomplete", I want it to just be "flight_from".

This won't work because:

  • the hidden <select> has name flight_from, it will have the model pk as value,
  • the <input> is only here for autocompletion purposes and its value is not meant to be sent to the Form object, hence the -autocomplete suffix in its name.

You're saying that you tried to change the name attribute of the autocompletion input, but you're not saying why are you even trying to do that. So there's nothing more i can do for you.

jpic
  • 32,891
  • 5
  • 112
  • 113