2017-01-21 5 views
0

У меня есть простая форма для добавления веб-сайта в базу данных. Это мой сайт модель:Django - поля формы динамических изменений

class Site(models.Model): 
    category = models.ForeignKey('Category') 
    category1 = models.ForeignKey('Category', related_name='+',) 
    subcategory = ChainedForeignKey(
     'Subcategory', 
     chained_field='category', 
     chained_model_field='category', 
     show_all=False, 
     auto_choose=True) 
    name = models.CharField(max_length=70) 
    description = models.TextField() 
    # importuje zmienione TextFields widgets.py 
    keywords = MyTextField() 
    date = models.DateTimeField(default=datetime.now, editable=False) 
    url = models.URLField() 
    is_active = models.BooleanField(default=False) 
    group = models.CharField(max_length=2, choices=(('Basic', 
                'Basic'), ('Premium', 'Premium'))) 

subcategory1 = ChainedForeignKey(
    'Subcategory', 
    chained_field='category1', 
    chained_model_field='category1', 
    related_name='subcategory1', 
    show_all=False, 
    auto_choose=True) 

def get_absolute_url(self): 
    return "%s/%i" % (self.subcategory.slug, self.id) 

class Meta: 
    verbose_name_plural = "Sites" 

def __str__(self): 
    return self.name 

Forms.py

class SiteAddFormFull(forms.ModelForm): 

    url = forms.URLField(widget=forms.TextInput(attrs={'readonly': 'readonly'})) 

    class Meta: 
     model = Site 
     fields = ('url', 'name', 'description', 'keywords', 'group', 'category1','subcategory1') 

Я хотел бы изменить свою форму, добавив «category1» полей, «Subcategory1» после того, как пользователь может выбрать значение в поле группы ("Премиум «). Форма должна перезагрузиться и показать эти поля. Прежде чем выбирать поля «Premium» «Категория1», «Подкатегория1» должна быть невидимой. Как я могу это достичь?

В моем forms.py я добавил:

widgets = {'category1': forms.HiddenInput(), 'subcategory1': 
        forms.HiddenInput()} 

В моем .js файл я пытаюсь показать эти поля, но это не работает:

$(":hidden").show(); 
// $("#id_category1".show() and other posibilities 

В моей странице Soure У меня есть

<input id="id_category1" name="category1" type="hidden" /><input id="id_subcategory1" name="subcategory1" type="hidden" /> 

Почему это не работает?

+1

нагрузки все данные и использовать JavaScript на стороне клиента, чтобы достичь того, чего вы хотите или сделать некоторые AJAX звонки на сервер для загрузки данных каждый раз, когда поле change –

+1

в форме init функция устанавливает эти атрибуты формы как скрытые, как только вы выбираете премиум с помощью js, удалите скрытый атрибут – rsb

ответ

0

Для категорий не требуется HiddenInput. Просто скройте его с помощью jquery и покажите его на выбранном событии изменения.

<select id="group"> 
    <option value="First">First</option> 
    <option value="Premium">Premium</option> 
    <option value="Second">second</option> 
</select> 
<select id="category1"> 
    <option value="First">First</option> 
    <option value="Second">second</option> 
</select> 

Jquery

$(document).ready(function(){ 
    $('#category1').hide(); 
    $('#group').change(function(e) { 
    var group = $(this).val(); 
    if (group == 'Premium'){ 
    $('#category1').show(); 
    } else { 
    $('#category1').hide(); 
    } 
    }); 
}); 

https://jsfiddle.net/fwfm9byy/1/

Смежные вопросы