Require 3 characters or more before calling an API for Lookup fields. Limit returned results to 20 objects. Include 'no value' option in lookup field results

This commit is contained in:
Michael Hall 2018-01-29 12:48:14 -05:00
parent 8e6fc7c4da
commit e15cdd7fc1
7 changed files with 75 additions and 87 deletions

View file

@ -203,4 +203,7 @@ class NewPlaceForm(forms.ModelForm):
widgets = {
'city': Lookup(source='/api/cities/', label='name'),
}
def __init__(self, *args, **kwargs):
super().__init__(*args, **kwargs)
self.fields['city'].required = True

View file

@ -41,9 +41,9 @@ def places_list(request, *args, **kwargs):
def country_list(request, *args, **kwargs):
if "q" in request.GET:
match = request.GET.get("q", "")
countries = Country.objects.filter(name__icontains=match)
countries = Country.objects.filter(name__icontains=match)[:20]
else:
countries = Country.objects.all()
countries = Country.objects.all()[:20]
serializer = CountrySerializer(countries, many=True)
return Response(serializer.data)
@ -51,9 +51,9 @@ def country_list(request, *args, **kwargs):
def spr_list(request, *args, **kwargs):
if "q" in request.GET:
match = request.GET.get("q", "")
sprs = SPR.objects.filter(name__icontains=match)
sprs = SPR.objects.filter(name__icontains=match)[:20]
else:
sprs = SPR.objects.all()
sprs = SPR.objects.all()[:20]
if "country" in request.GET and request.GET.get("country") is not "":
sprs = sprs.filter(country=request.GET.get("country"))
@ -64,9 +64,9 @@ def spr_list(request, *args, **kwargs):
def city_list(request, *args, **kwargs):
if "q" in request.GET:
match = request.GET.get("q", "")
cities = City.objects.filter(name__icontains=match)
cities = City.objects.filter(name__icontains=match)[:20]
else:
cities = City.objects.all()
cities = City.objects.all()[:20]
if "spr" in request.GET and request.GET.get("spr") is not "":
cities = cities.filter(spr=request.GET.get("spr"))

View file

@ -16,19 +16,23 @@
<script type="text/javascript">
$(document).ready(function(){
$("#city_search").keyup(function() {
var searchText = this.value;
$.getJSON("/api/cities/?q="+searchText, function(data) {
var searchField = $("#city_search")[0];
var q = this.url.match(/q=([^&]+)/)[1]
var c = searchField.value
if (c != q) return;
var searchText = this.value;
if (searchText.length < 3) return;
$.getJSON("/api/cities/?q="+searchText, function(data) {
var searchField = $("#city_search")[0];
var q = this.url.match(/q=([^&]+)/)[1]
var c = searchField.value
if (c != q) return;
var selectField = $("#city_select");
selectField.empty();
$.each(data, function(){
selectField.append('<option value="'+ this.id +'">'+ this.display+ '</option>')
var selectField = $("#city_select");
selectField.empty();
var selected = " selected"
selectField.append('<option value="">--------</option>')
$.each(data, function(){
selectField.append('<option value="'+ this.id +'"'+ selected +'>'+ this.display + '</option>');
selected="";
});
});
});
});
});
</script>

View file

@ -16,6 +16,7 @@ $(document).ready(function(){
$("#city_search").keyup(function() {
var searchText = this.value;
if (searchText.length < 3) return;
$.getJSON("/api/cities/?q="+searchText, function(data) {
var searchField = $("#city_search")[0];
var m = this.url.match(/q=([^&]+)/);
@ -25,10 +26,13 @@ $(document).ready(function(){
} var c = searchField.value
if (c != q) return;
var selectField = $("#city_select");
selectField.empty();
$.each(data, function(){
selectField.append('<option value="'+ this.id +'">'+ this.display + '</option>')
var selectField = $("#city_select");
selectField.empty();
var selected = " selected"
selectField.append('<option value="">--------</option>')
$.each(data, function(){
selectField.append('<option value="'+ this.id +'"'+ selected +'>'+ this.display + '</option>');
selected="";
});
});
});

View file

@ -14,53 +14,30 @@
{% block javascript %}
<script type="text/javascript">
$(document).ready(function(){
$("#country_search").keyup(function() {
var searchText = this.value;
$.getJSON("/api/countries/?q="+searchText, function(data) {
var searchField = $("#country_search")[0];
var q = this.url.match(/q=([^&]+)/)[1]
var c = searchField.value
if (c != q) return;
var selectField = $("#country_select");
selectField.empty();
$.each(data, function(){
selectField.append('<option value="'+ this.id +'">'+ this.name + '</option>')
});
});
});
$("#spr_search").keyup(function() {
var searchText = this.value;
var country_id = $("#country_select")[0].selectedOptions[0].value;
$.getJSON("/api/spr/?q="+searchText+"&country="+country_id, function(data) {
var searchField = $("#spr_search")[0];
var q = this.url.match(/q=([^&]+)/)[1]
var c = searchField.value
if (c != q) return;
var selectField = $("#spr_select");
selectField.empty();
$.each(data, function(){
selectField.append('<option value="'+ this.id +'">'+ this.name + '</option>')
});
});
});
$("#city_search").keyup(function() {
var searchText = this.value;
var spr_id = $("#spr_select")[0].selectedOptions[0].value;
$.getJSON("/api/cities/?q="+searchText+"&spr="+spr_id, function(data) {
var searchField = $("#city_search")[0];
var q = this.url.match(/q=([^&]+)/)[1]
var c = searchField.value
if (c != q) return;
if (searchText.length < 3) return;
$.getJSON("/api/cities/?q="+searchText, function(data) {
var searchField = $("#city_search")[0];
var m = this.url.match(/q=([^&]+)/);
var q = "";
if (m && m.length > 0) {
q = this.url.match(/q=([^&]+)/)[1]
} var c = searchField.value
if (c != q) return;
var selectField = $("#city_select");
selectField.empty();
var selected = " selected"
selectField.append('<option value="">--------</option>')
$.each(data, function(){
selectField.append('<option value="'+ this.id +'">'+ this.name + '</option>')
});
});
selectField.append('<option value="'+ this.id +'"'+ selected +'>'+ this.display + '</option>');
selected="";
});
});
});
});
</script>

View file

@ -35,31 +35,4 @@ def home(request, *args, **kwards):
else:
return render(request, 'get_together/index.html')
def places_list(request, *args, **kwargs):
places = Place.objects.all()
context = {
'places_list': places,
}
return render(request, 'get_together/places/list_places.html', context)
def create_place(request):
if request.method == 'GET':
form = NewPlaceForm()
context = {
'place_form': form,
}
return render(request, 'get_together/places/create_place.html', context)
elif request.method == 'POST':
form = NewPlaceForm(request.POST)
if form.is_valid:
new_place = form.save()
return redirect('places')
else:
context = {
'place_form': form,
}
return render(request, 'get_together/places/create_place.html', context)
else:
return redirect('home')

View file

@ -14,4 +14,31 @@ import datetime
import simplejson
# Create your views here.
def places_list(request, *args, **kwargs):
places = Place.objects.all()
context = {
'places_list': places,
}
return render(request, 'get_together/places/list_places.html', context)
def create_place(request):
if request.method == 'GET':
form = NewPlaceForm()
context = {
'place_form': form,
}
return render(request, 'get_together/places/create_place.html', context)
elif request.method == 'POST':
form = NewPlaceForm(request.POST)
if form.is_valid():
new_place = form.save()
return redirect('places')
else:
context = {
'place_form': form,
}
return render(request, 'get_together/places/create_place.html', context)
else:
return redirect('home')