我想建立一个国家/州选择器。首先,您选择一个国家,然后在第二个选择框中显示该国家的州。在PHP和jQuery中执行此操作相当容易,但我发现Django表单在某种意义上具有一定的局限性。
我可以将“状态”字段设置为在页面加载时为空,然后使用一些jQuery填充该字段,但是如果出现表单错误,它将无法“记住”您选择的状态。我也很确定它会引发验证错误,因为您的选择不是Python方面表单中列出的选择之一。
那么如何解决这些问题呢?
你可以将一个隐藏字段设置为具有真正的“状态”值,然后使用jQuery创建<select>列表,然后.select()将其值复制到该隐藏字段中。然后,在页面加载时,你的jQuery代码可以获取隐藏字段的值,并在<select>填充后使用它在元素中选择合适的项目。
<select>
.select()
这里的关键概念是“状态”弹出菜单是一种完全使用jQuery创建的小说,而不是Django形式的一部分。这使你可以完全控制它,同时让所有其他字段正常工作。
编辑:还有另一种方法,但是它不使用Django的表单类。
在视图中:
context = {'state': None, 'countries': Country.objects.all().order_by('name')} if 'country' in request.POST: context['country'] = request.POST['country'] context['states'] = State.objects.filter( country=context['country']).order_by('name') if 'state' in request.POST: context['state'] = request.POST['state'] else: context['states'] = [] context['country'] = None # ...Set the rest of the Context here... return render_to_response("addressform.html", context)
然后在模板中:
<select name="country" id="select_country"> {% for c in countries %} <option value="{{ c.val }}"{% ifequal c.val country %} selected="selected"{% endifequal %}>{{ c.name }}</option> {% endfor %} </select> <select name="state" id="select_state"> {% for s in states %} <option value="{{ s.val }}"{% ifequal s.val state %} selected="selected"{% endifequal %}>{{ s.name }}</option> {% endfor %} </select>
你还需要通常的JavaScript,以便在更改国家/地区后重新加载州选择器。
我尚未对此进行测试,因此其中可能有几个漏洞,但应该可以理解。
因此,你的选择是: