-1
提交時，我很難在Django表單中提取jQuery滑塊值。當頁面被訪問或刷新時，我可以通過外部和內部urls.py和views.py中的URL將值傳遞給它，但我不能在提交時在表單中包含滑塊值。不用說，我已經嘗試了很多方法來提取值，包括jQuery post方法和AJAX，但我沒有嘗試過。將jQuery滑塊值傳遞到Django表單
首先，我創建了一個簡單的窗體（forms.Form），然後嘗試使用模型窗體，期望更多的控件，但返回到forms.Form。我form.py是：
class ChoiceForm(forms.Form):
'''Checkboxes.'''
GeoJunk = forms.BooleanField(required=False, initial=True)
...
'''Field for jQuery slider widget value. I initially don’t care if it is hidden, especially during troubleshooting.'''
slider_field = forms.CharField(max_length=4, required=False)
我views.py是複雜的，但本質是：
def profile_list(request, sort_arg='default', latlonzoom='39.991622,-105.250098,15', choice='7', rangefactor='0'):
request_user = request.user
''' Initialize slider value. '''
slider_value = 0
if request.method == 'POST':
choice_form = ChoiceForm(request.POST, prefix="choice")
if choice_form.is_valid():
bit1 = choice_form.cleaned_data['GeoJunk']
...
'''The slider value submitted from form.'''
slider_state = choice_form.cleaned_data['slider_value']
else:
choice_form = ChoiceForm()
…
return render(request, "junkster/pages/home.html", add_csrf(request, MEDIA_URL=MEDIA_URL, STATIC_URL=STATIC_URL, request_user=request_user, waypoints=waypoints, librarypoints=librarypoints, gs_waypoints=gs_waypoints, search_flag=search_flag, lat=lat, lon=lon, zoom=zoom, waypoints_count=waypoints_count, librarypoints_count=librarypoints_count, gs_waypoints_count=gs_waypoints_count, choice_form=choice_form, sort_arg=sort_arg, latlonzoom=latlonzoom, choice=choice, rangefactor=rangefactor, slider_state=slider_state
))
模板是複雜的，但在本質上開始choice.html並最終延伸至基地-geomap.html：
基geomap.html：
<!doctype html>
<html lang="{{ LANGUAGE_CODE }}"{% if LANGUAGE_BIDI %} dir="rtl"{% endif %}>
{% load pages_tags mezzanine_tags i18n staticfiles %}
<head>
…
<link rel="stylesheet" href="{% static "junkster/css/jquery-ui.css" %}">
<link rel="stylesheet" href="{% static "junkster/css/jquery-ui.min.css" %}">
<link rel="stylesheet" href="{% static "junkster/css/jquery-ui.theme.css" %}">
<link rel="stylesheet" href="{% static "junkster/css/jquery-ui.theme.min.css" %}">
<link rel="stylesheet" href="{% static "junkster/css/jquery-ui.slider.css" %}">
<link rel="stylesheet" href="{% static "junkster/css/jquery-ui-timepicker- addon.css" %}">
<link rel="stylesheet" href="{% static "junkster/css/jquery.simple-dtpicker.css" %}">
{% endcompress %}
{% compress js %}
<script src="{% static 'mezzanine/js/jquery-1.7.2.min.js' %}"></script>
<script src="{% static "js/bootstrap.js" %}"></script>
<script src="{% static "js/bootstrap-extras.js" %}"></script>
<script type="text/javascript" language="javascript" src="https://code.jquery.com/jquery-2.0.3.min.js"></script>
<script type="text/javascript" src="{% static "junkster/js/jquery-ui.js" %}"></script>
<script type="text/javascript" src="{% static "junkster/js/jquery-min.js" %}"></script>
<script type="text/javascript" src="{% static "junkster/js/jquery-ui-min.js" %}"></script>
<script type="text/javascript" src="{% static "junkster/js/jquery-ui-sliderAccess.js" %}"></script>
<script type="text/javascript" src="{% static "junkster/js/jquery-ui-timepicker-addon.js" %}"></script>
{% endcompress %}
…
<script>
//Follows: var URL = "{% url 'junkster:profile_list' default' latlonzoom choice rangefactor %}";
var URL = "{% url 'junkster:profile_list' 'default' '39.99, -105.25,15' '7' '2' %}";
</script>
<script>
$(function() {
//Array of slider values.
var valMap = ['1mi', '4mi', 'All'];
$("#slider_vertical").slider({
orientation: "vertical",
range: false,
max: valMap.length - 1,
//Set initial value to the URL rangefactor.
// This will be a value of [0, 1, 2].
value: {{rangefactor}},
//"slide" or "change" work equally well.
slide: function(event, ui) {
//Index values of [0, 1, 2].
$("#val").text(ui.value);
//Mapped values of ['1mi', '4mi', 'All'].
$("#nlVal").text(valMap[ui.value]);
//Shows mapped value of slider on top, e.g., "1mi,"
// rather than rangefactor value "0."
$("#amount").val(valMap[ui.value]);
/Affects the HTML template "slider_value" input field.
$('#id_slider_field').val(valMap[ui.value]);
//Does not work.
//$('#id_slider_field').attr('value', ui.value);
}
});
//Shows the mapped value of slider on top upon startup.
$("#amount").val(valMap[$("#slider_vertical").slider("value")]);
});
</script>
</head>
…
choiceform.html：
{% extends "junkster/pages/geolist.html" %}
{% block choiceform %}
<form action="" method="post">
{% csrf_token %}
<!--Keep checkboxes in list.-->
{{ choice_form.as_ul }}
<input type="submit" name="choicevalue" value="Submit" />
<br><br>
<!-- -----JQuery Slider.---- -->
<b>Range of View:</b>
<!--Mapped value display on top of slider.-->
<input type="text" id="amount" readonly style="border:0; color:#f6931f; font-weight:bold; margin-left:3em;">
<!--Slider widget.-->
<div id="slider_vertical" style="height:12em; margin-left:3em;"></div>
<br>
<!--For diagnostics.-->
<!--」rangefactor」 should assume the slider value.-->
rangefactor = {{ rangefactor }}<br><br>
<!--」slider_valuer」 is the slider value from view.-->
slider_value = {{ slider_value }}<br>
<!--This html field does show the value of the slider.-->
<input type="text" id="id_slider_field", name="slider_field">
</form>
{% endblock %}
的choiceform.html的最後部分有確實顯示滑塊改變值的輸入文本字段，但我不能與Django的表單字段提交本，除非我的錯誤我。
我希望jQuery的功能可以實現在最終模板的東西，如：
rangefactor = slider_value
a href="{% url 'junkster:profile_list' 'default' latlonzoom choice rangefactor %}">Wish this would happen!</a>
我感謝提供建議的人，因爲我曾嘗試與Django的形式的其他沿着提取滑塊值複選框值。
Walter Goedecke
這是很多代碼。請僅發佈最相關的位。即您的JavaScript代碼，使ajax請求和處理它的python視圖。 – e4c5
它很多;我不確定我現在是否可以修剪代碼。 – user3532823