时间戳

首页 > 解决方案 > Django 变量形式

jquery - Django 变量形式

问题描述

我正在尝试使用 Django 制作结帐表格，客户必须填写送货地址并选择日期。我希望根据,shippingDate改变选择。shippingAddress1shippingCity

有什么方法可以实现它？

这是地址表格：

class DeliveryForm(forms.Form):
    def __init__(self,date_list,*args,**kwargs):
              # call standard __init__
              super().__init__(*args,**kwargs)
              #extend __init__
              self.fields['shippingDate'] = forms.ChoiceField(choices=tuple([(date, f"{date.strftime('%d')} {months[date.strftime('%m')]}") for date in date_list]), required=True)


    shippingAddress1 = forms.CharField(max_length=250, help_text='ул. Бассейная 10',required=True, label='Адрес')
    shippingFlat = forms.CharField(max_length=250, help_text='кв.10', required=False, label='Квартира')
    shippingCity = forms.CharField(max_length=250, help_text='Киев',required=True, label='Город')
    shippingPostcode = forms.CharField(max_length=250, help_text='01011',required=True, label='Почтовый индекс')
    shippingDate = forms.DateField()

views.py：

def delivery(request):
    parameters = {}
    form = DeliveryForm(date_list = get_dates())
    parameters.update({'form' : form})
    return render(request, 'delivery.html', parameters)

这是表单的 HTML 代码（如果需要）：

<div class="container my-auto pb-5 px-5">
    {% if not form.is_valid %}
        <div class="row mt-5">
            <div class="col-12 col-md-10 offset-md-1 col-xl-8 offset-xl-2 text-center">
                <div class="text-center " >
                    <h3 class="product_title">Доставка</h3>
                </div>
                <hr>
                <form id='deliveryForm'>
                    {% csrf_token %}
                    <p id="failure_message" style="color: red;">{{failure_message}}</p>
                    <div class="container-fluid">
                        <div class="row">
                            <div class="col-9 form-group">
                                <div class="input-group">
                                    <div class="input-group">
                                        <div class="input-group-prepend">
                                            <span class="input-group-text"><i class="fas fa-map-marker-alt"></i></span>
                                        </div>
                                        {% render_field form.shippingAddress1 class+="form-control" placeholder='*Адрес (Бассейная 10)' %}
                                    </div>
                                </div>
                            </div>
                            <div class="col-3 form-group">
                                <div class="input-group">
                                    <div class="input-group">
                                        {% render_field form.shippingFlat class+="form-control" placeholder='кв.' %}
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-8 form-group">
                                <div class="input-group">
                                    <div class="input-group">
                                        <div class="input-group-prepend">
                                        <span class="input-group-text"><i class="fas fa-city"></i></i></span>
                                        </div>
                                        {% render_field form.shippingCity class+="form-control" placeholder='*Город' %}
                                    </div>
                                </div>
                            </div>
                            <div class="col-4 form-group">
                                <div class="input-group">
                                    <div class="input-group">
                                        {% render_field form.shippingPostcode class+="form-control" placeholder='*Индекс' %}
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-12 form-group">
                                <div class="input-group mb-3">
                                    <div class="input-group mb-3">
                                        <div class="input-group-prepend">
                                        <span class="input-group-text"><i class="fas fa-calendar-day"></i></span>
                                        </div>
                                        {% render_field form.shippingDate class+="form-control" %}
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <input type='submit' class="btn btngreen btn-block py-2 mt-3" value="Перейти к оплате"/>
                </form>
                <div class="container mt-3">
                    <div class="row">
                        <div class="col">
                            <a href="{% url 'shop' %}">
                                <button class="btn btnwhite w-100">Продолжить покупки</button>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    {% else %}
        <div class="row">
            
            <div class="col-12 col-md-10 offset-md-1 col-xl-8 offset-xl-2 text-center">
                <button type="button" class="btn btngreen w-100" onclick="pay('{{productName}}', '{{productPrice}}', '{{productCount}}', '{{amount}}', '{{orderReference}}', '{{orderDate}}', '{{merchantSignature}}', '{{merchantAccount}}', '{{merchantDomainName}}', '{{currency}}', '{{language}}', '{{serviceUrl}}')">Оплатить</button>
            </div>
        </div>
    {% endif %}
</div>

标签： jquerydjangoforms

解决方案

所以我想出了如何使用 AJAX 请求来做到这一点。然而，这是一种非常复杂的方式。我发现最好的方法是使用 Django 作为后端，使用 React JS 作为前端（Angular 或 Vue 也可以）

推荐阅读