DJANGO如何在复选框旁边显示文本表单字段

Question

我正在创建一个应用程序，允许您将预定义的服务添加到发票中。创建新发票时，可以使用复选框选择服务。我想在选中复选框后添加文本字段以指定数量。因此，选中复选框，文本字段将显示在其旁边，您可以在其中输入数量。我想在创建新发票后将此数据存储在数据库中。我不知道如何才能做到这一点。我需要JS还是只需要Django就足够了

更新7.06.2020 models.py

class Service(models.Model):
    nazwa = models.CharField(max_length=100)
    cena = models.FloatField()

    def __str__(self):
        return f'{self.nazwa} - cena: {self.cena}zł'

class ServiceItem(models.Model):
    usluga = models.ForeignKey(Service, on_delete=models.CASCADE)
    ilosc = models.PositiveIntegerField(default=1)

    def __str__(self):
        return f'{self.usluga.nazwa} - cena: {self.usluga.cena}zł'

class Invoice(models.Model):
    forma_platnosci_wybor = [
        ('przelew', 'przelew'),
        ('gotowka', 'gotówka')
    ]

    numer = models.CharField(max_length=30)
    firma = models.ForeignKey(Company, on_delete=models.CASCADE)
    forma_platnosci = models.CharField(verbose_name='forma płatności', max_length=75, choices=forma_platnosci_wybor)
    data_badania = models.DateField()
    data_wystawienia_faktury = models.DateTimeField()

    rabat = models.IntegerField(verbose_name='rabat [%]', blank=True, null=True)
    uslugi = models.ManyToManyField(ServiceItem, blank=True, null=True)

    def __str__(self):
        return self.numer

forms.py

class NewInvoiceForm(forms.ModelForm):

    class Meta:
        model = Invoice
        fields = '__all__'
        exclude = ['numer', 'data_wystawienia_faktury']
        widgets = {
            'usluga' : forms.CheckboxSelectMultiple,
            'data_badania' : DateInput(),
        }

模板形式

<legend class="col-12">Tworzenie nowej faktury</legend>
    <form method="post" enctype="multipart/form-data">
        {% csrf_token %}
        <fieldset>
        <div class="form-row">
            <div class="col-lg-4">
                {{ form.firma | as_crispy_field}}
            </div>
        </div>
        <div class="form-row">
            <div class="col-lg-2">
                {{ form.forma_platnosci | as_crispy_field}}
            </div>
            <div class="col-lg-2">
                {{ form.data_badania | as_crispy_field}}
            </div>
        </div>
        <div class="form-row">
            <div class="col-lg-4">
                {{ form.rabat | as_crispy_field}}
            </div>
        </div>
        <div class="form-row">
            <div class="col-lg-4">
                {{ form.uslugi | as_crispy_field }}
            </div>
        </div>
    </fieldset>
        <button type="submit" class="btn btn-info"><i class="far fa-edit"></i> Zatwierdź fakturę</button>
    </form>

ScreenShot

Answer 1

您需要呈现隐藏的文本字段，并使用JS使其可见，例如使用复选框上的onclick事件。如果这是表单上的一个文档，那么它可能很简单，如果是动态生成的复选框和文本字段的多个文档，那么它可能会稍微困难一些，但是是可行的

Answer 2

如果我理解正确，您希望在表单出现之前单击复选框，对吗？如果是这样，js的想法就必须落实到位