POST方法不會從Form(DJANGO&BOOTSTRAP)收到任何資訊

我有一個注冊新用戶的表單，我使用 Bootstrap 5 讓它看起來不錯。但是，當我按下提交按鈕時，表單不會驗證。我寫的時候顯示的錯誤print(form.errors)說每個欄位都是必需的，這意味著它沒有收到任何東西。為什么會發生這種情況？這是我的代碼：

HTML

<div class="card" id='signup_card'>
<div class='card-header'>
    <h2 class='card-title'>Sign Up</h2>
</div>
<div class='card-body'>
    <form method='POST' action="" id='create_user_form' style="color: #fff;">
        {% csrf_token %}
        <label for='usernameInput' class="form-label">{{form.username.label}}:</label>
        <input type="text" id='usernameInput' style="margin-bottom: 20px;">

        <label for='phoneNumberInput' class="form-label">{{form.phone_number.label}}:</label>
        <input type="text" id='phoneNumberInput' style="margin-bottom: 20px;">

        <label for='emailInput' class="form-label">{{form.email.label}}:</label>
        <input type="text" id='emailInput' style="margin-bottom: 20px;">

        <label for='password1Input' class="form-label">{{form.password1.label}}:</label>
        <input type="text" id='password1Input' style="margin-bottom: 20px;">

        <label for='password2Input' class="form-label">{{form.password2.label}}:</label>
        <input type="text" id='password2Input' style="margin-bottom: 20px;">
        
        <button class="btn btn-primary" type='submit'>Submit</button>
    </form>
</div>

模型.py

class Account(User):
    phone_number = BigIntegerField()

表格.py

class CreateAccountForm(UserCreationForm):
    class Meta:
        model = Account
        fields = ['username', 'email', 'phone_number', 'password1', 'password2']

視圖.py

def signup(request):
    if request.method == 'GET':
        form = CreateAccountForm()
        ctx = {
            'form':form
        }
        return render(request, 'signup.html', ctx)

    if request.method == 'POST':
        form = CreateAccountForm(request.POST)
        if form.is_valid():
            form.save()
        else:
            print(form.errors)

        return render(request, 'index.html')

uj5u.com熱心網友回復：

您的輸入元素需要指定一個name="…"屬性來指定它們將關聯值的名稱：

<form method='POST' action="" id='create_user_form' style="color: #fff;">
    <label for='usernameInput' class="form-label">{{form.username.label}}:</label>
    <input type="text"name="username" id='usernameInput' style="margin-bottom: 20px;">

    <label for='phoneNumberInput' class="form-label">{{form.phone_number.label}}:</label>
    <input type="text" name="phone_number" id='phoneNumberInput' style="margin-bottom: 20px;">

    <label for='emailInput' class="form-label">{{form.email.label}}:</label>
    <input type="text" name="email" id='emailInput' style="margin-bottom: 20px;">

    <label for='password1Input' class="form-label">{{form.password1.label}}:</label>
    <input type="text" name="password1" id='password1Input' style="margin-bottom: 20px;">

    <label for='password2Input' class="form-label">{{form.password2.label}}:</label>
    <input type="text" name="password2" id='password2Input' style="margin-bottom: 20px;">
    <button class="btn btn-primary" type='submit'>Submit</button>
</form>

uj5u.com熱心網友回復：

您的錯誤是正常的，因為您需要向輸入欄位添加名稱屬性：

<label for='usernameInput' class="form-label">{{form.username.label}}:</label>
<input type="text" id='usernameInput' name='username' style="margin-bottom: 20px;">

你也可以像這樣使用完整的 Django 表單：

<label for='usernameInput' class="form-label">{{form.username.label}}:</label>
{{ form.username }}

現在，如果您想添加一些 boostrap 類名稱以使其看起來更美觀，您可以__init__像這樣覆寫 Form 類方法：

class CreateAccountForm(UserCreationForm):
    class Meta:
        model = Account
        fields = ['username', 'email', 'phone_number', 'password1', 'password2']
    
    # Here we override the form elements attributes to add boostrap class
    def __init__(self, *args, **kwargs):
        super(RegistrationForm, self).__init__(*args, **kwargs)
        # Add some placeholder to username input field
        self.fields['username'].widget.attrs['placeholder'] = 'Your username'
        # add an id to username input field
        self.fields['username'].widget.attrs['id'] = 'usernameInput'

        # add the same class to all the fields (commom attribute value for all)
        for field in self.fields:
            self.fields[field].widget.attrs['class'] = 'form-control'

更多關于 Django 模型表單在這里

標籤：Python 姜戈 bootstrap-5

上一篇：javaScript陣列和元素

下一篇：如何在Django應用程式中測驗洗掉視圖？