首页 > 解决方案 > 提交按钮后取消选中 HTML 复选框

问题描述

我写了一个密码管理器,其中包含字符/数字等符号和特殊字符的长度和复选框!$&

每次我点击提交按钮以生成密码时,都会再次选中未选中的框(因为我的默认设置是它们应该被选中),但是我怎样才能使该框像提交表单之前一样。我在模板中使用 if 语句进行了尝试,因为我使用的是 django,但这没有帮助。如果有人知道如何实现我的解决方案,请告诉我。谢谢你的帮助

这是我的代码:

def view_passwordgenerator(request):
    alphabets_b = bool(request.GET.get('alphabets'))
    digits_b = bool(request.GET.get('digits'))
    special_characters_b = bool(request.GET.get('special_characters'))
    alphabets = string.ascii_letters*alphabets_b
    digits = string.digits*digits_b
    special_characters = "!@#$%^&*()"*special_characters_b
    characters = alphabets + digits + special_characters
    if 'length' in request.GET:
        length = int(request.GET.get('length'))
        password = ''
        for i in range(length):
            password+=random.choice(characters)    
        pyperclip.copy(password)
        pyperclip.paste()
        messages.info(request, 'The password was copied to your clipboard')
        username = request.user.username
        context = {'password': password, 'length': length, 'username': username}

        return render(request, 'home/passwordgenerator.html', context)
    username = request.user.username
    hs = {'username': username}
    return render(request, 'home/passwordgenerator.html', hs)

和我的模板:

                       <form method="get" action="{% url 'home:passwordgenerator' %}">
                           <div class="fake_input">

                           <p class="fake_input_text">{{ password }}</p>
                           </div>
                                   <span class="fake_input_l">Length:</span> <select class="fake_input_drop" name="length"> 
                                       <option value="8" {% if length == 8 %}selected{% endif %}>8</option>
                                       <option value="10" {% if length == 10 %}selected{% endif %}>10</option>
                                       <option value="12" {% if length == 12 %}selected{% endif %}>12</option>
                                       <option value="14" {% if length == 14 %}selected{% endif %}>14</option>
                                       <option value="16" {% if length == 16 %}selected{% endif %}>16</option>
                                       <option value="18" {% if length == 18 %}selected{% endif %}>18</option>
                                       <option value="20" {% if length == 20 %}selected{% endif %} >20</option>
                                   </select>
                                   <span class="fake_input_l"> Alphabet Letters: <input type="checkbox" name="alphabets" checked>
                                   Digits: <input type="checkbox" name="digits" checked>
                                   Special Characters: <input type="checkbox" name="special_characters" checked></span>
                                   <button type="submit" value="Generate Password" class="fake_input_button">Generate</button>     
                       </form>

标签: pythondjangopasswords

解决方案


您应该在上下文中设置这些复选框值,当您返回该页面时检查这些值并根据标记为选中或未选中的标志,如下所示:-

def view_passwordgenerator(request):
    username = request.user.username
    alphabets_b = bool(request.GET.get('alphabets'))
    digits_b = bool(request.GET.get('digits'))
    special_characters_b = bool(request.GET.get('special_characters'))
    ...
    context = {'username': username}
    if 'length' in request.GET:
        ...
        ...
        context.update({'password': password, 'length': length, 'alphabets_b': alphabets_b, 'digits_b': digits_b, 'special_characters_b': special_characters_b})
    else:
        context.update({'alphabets_b': True, 'digits_b': True, 'special_characters_b': True})

    return render(request, 'home/passwordgenerator.html', context)

在您的 HTML 页面中,您应该检查如下标志:-

<span class="fake_input_l"> 
    Alphabet Letters: <input type="checkbox" name="alphabets" {% if alphabets_b %}checked {% endif %} >
    Digits: <input type="checkbox" name="digits" {% if digits_b %}checked {% endif %}>
    Special Characters: <input type="checkbox" name="special_characters" {% if special_characters_b %}checked {% endif %}>
</span>

推荐阅读