簡體   English   中英

Django Javascript集成

[英]Django Javascript integration

我正在嘗試選擇一個選項時創建一個動態列表(類型為radio)。 我可以獲取列表的值,但是無法在頁面上查看。

這是代碼:javascript:

$(document).ready(function() {
    $("select[name=city]").change(function() {
        if ($(this).val() == '') {
            $("select[name=term]").html("<option>Select a frequency</option>");
            $("select[name=term]").attr('disabled', true);
        }
        else {
            var url = "/locality/city/" + Number($(this).val());
            console.log(url)

            $.getJSON(url, function(frequency_list) {
                var li = '<ul id="id_term"><li><label><input id="id_term_0" type="radio" value="-1" name="term"></input>None</label></li>'

                for (var i = 0; i < frequency_list.length; i++) {
                    // console.log(frequency_list[i][0],frequency_list[i][0]);
                    var id = "id_term_" + String(i)
                    li += '<li><label><input id='+String(id)+ ' type="radio" value='+frequency_list[i][0]+ ' name="term"></input>'+frequency_list[i][1]+'</label></li>'
                    console.log(li);
                }

                li +='</ul>'
                $("select[name=term]").html(li);
                // $("select[name=term] li:first").attr('selected', 'selected');
                $("select[name=term]").attr('disabled', false);
            });
        }
    });

    $("select[name=term]").change(function(vent) {
        if ($(this).val() == -1) {
            return;
        }
    });
});

形式:

class CityForm(forms.Form):
    city = forms.ModelChoiceField(queryset=City.objects.all().filter(tagged=True))

class FrequencyForm(CityForm):
    """
    Generates a form consisting of a list of trigrams, bigrams and unigrams in ratio 8:8:2
    """

    def __init__(self, *args, **kwargs):
        super(FrequencyForm, self).__init__(*args, **kwargs)
        self.frequency_list = [('-1','None')]
        self.fields['term'] = forms.ChoiceField(choices=self.frequency_list, required=True, widget=forms.RadioSelect())

如果您的列表從getJSON調用中不能通過,則問題可能出在您嘗試注入不是<select>元素中的<select> <option> <select>內容時。 請參見<select>規范: https : //developer.mozilla.org/en-US/docs/Web/HTML/Element/select它說:

允許的內容零個或多個選項或optgroup元素。

因此,此行很可能不會給出任何結果:

$("select[name=term]").html(li);

因此,您可以事后添加,也可以創建一個新的非select元素來包含您的列表。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM