如何在HTML和Django中連接2個表單？

我正在創建一個網頁，我想知道是否可以確保在按下藍色按鈕之前填充左側的資料。在左側，您可以看到通過輸入您的地址、城市等進行支付的表格，但在右側，您可以看到另一個帶有條紋的表格，用于使用信用卡支付。我不知道如何從左側獲取資料并將其保存在資料庫中，以便在成功付款后創建收據。這是下面的代碼。

<div class="container-2">
    <div class="gray-hover">
        <form method="POST">
            <div class="item" id="payment">
                <div class="row">
                    <h4>Mo?nost nakupa 1: Pla?ilo po povzetju <small><i>(Za pla?evanje s kartico je treba izbrati samo
                                koli?ino in vrsto izdelka!)</i></small></h4>
                    {% csrf_token %}
                    {% if form %}
                    <div class="input-group">
                        <div style="color: red;">{{ form.name.errors }}</div>
                        {{ form.name }}
                    </div>
                    <div class="input-group">
                        <div style="color: red;">{{ form.last_name.errors }}</div>
                        {{ form.last_name }}
                    </div>
                    <div class="input-group">
                        <div style="color: red;">{{ form.street_name.errors }}</div>
                        {{ form.street_name }}
                    </div>
                    <div class="input-group">
                        <div style="color: red;">{{ form.city_name.errors }}</div>
                        {{ form.city_name }}
                    </div>
                    <div class="input-group">
                        <div style="color: red;">{{ form.email.errors }}</div>
                        {{ form.email }}
                    </div>
                    <div class="input-group">
                        <div style="color: red;">{{ form.number.errors }}</div>
                        {{ form.number }}
                    </div>
                    {% endif %}

                </div>
            </div>
            <div class="item" id="payment2">
                <div class="row">

                    <div class="input-group">
                        {{ form.num_elements.errors }}
                        {{ form.num_elements }}
                    </div>
                    <div class="input-group" id="check_div">
                        <div
                            style="display: flex;width:100%;justify-content: space-between;align-items: center;font-size:medium;flex-wrap: wrap;">
                            <div style="display: flex;justify-content: space-between;margin:3px;">
                                {{ form.select_type.errors }}
                                {{ form.select_type.label_tag }}
                                {{ form.select_type }}
                            </div>

                            <div style="display: flex;justify-content: space-between;margin:3px;">
                                {{ form.select_type2.errors }}
                                {{ form.select_type2.label_tag }}
                                {{ form.select_type2 }}
                            </div>

                        </div>
                    </div>
                    <div class="input-group">
                        {{ form.warning_el.errors }}
                        {{ form.warning_el }}
                    </div>
                    <div style="display: flex;justify-content: space-between;margin: 0.5rem;">
                        <button class="button" type="submit" id="button"> Naro?i <small>(povzetje)</small></button>
                        <a class="button" id="stripe-button">Pla?aj s kartico!</a>
                    </div>
                </div>
            </div>
        </form>

    </div>
    <div class="gray-hover">
        <div class="item" id="payment3" style="width:100%;">
            <h4>Mo?nost nakupa 2: Pla?ilo s kartico <small><i>(Za pla?evanje s kartico je treba izbrati samo
                        koli?ino in vrsto izdelka!)</i></small></h4>
            <div class="row" style="display: flex; justify-content: center;">
                <form id="payment-form" data-locale="si" style="width:100%;">
                    <div id="payment-element">
                        <!--Stripe.js injects the Payment Element-->
                    </div>
                    <button id="submit" class="button1">
                        <div class="spinner hidden" id="spinner"></div>
                        <span id="button-text">Pla?aj</span>
                    </button>
                    <div id="payment-message" class="hidden"></div>
                </form>
            </div>
        </div>

    </div>

</div>

這是“CONTAINER-2”的螢屏截圖

uj5u.com熱心網友回復：

首先確保您的所有輸入都在一種形式和一種視圖下。

在您的 Django 表單中使用required=True以確保輸入每個輸入。

例如，如果您使用 Django 表單

from django import forms
class FooForm(forms.Form):
     email = forms.EmailField(max_length=100,required=True,
                               widget=forms.TextInput(
                               attrs={ 'required': 'true' }),
     )

在您看來，使用表單 is_valid 方法

form = FooForm(request.POST)
if form.is_valid():
  # Complete Your Business Logic
  ...
  return redirect("redirect_view")
# Else Return With Error Message

使用表格保存您的資料。如果不能選擇使用 Django 表單，則必須使用 javascript 禁用按鈕，直到所有輸入都沒有填滿

標籤：

上一篇：用于html的Djangohref

下一篇：Django和redis將:1添加到鍵中