无法在模式对话框中显示表单

时间:2018-08-13 21:14:51

标签: javascript html django django-2.0

我无法从模式窗口中显示密码更改。

我可以看到模态窗口,但是即使我在模态的S1 Logit_tussac soil_moisture DEM_slope DEM_aspect DEM_elevation sentinel1 sentinel2 sentinel3 sentinel4 sentinel5 sentinel6 sentinel7 sentinel8 sentinel9 sentinel10 NA NA NA 14.917334 256.1612 12.24432 0.0513 0.0588 0.0541 0.1145 0.1676 0.1988 0.1977 0.1658 0.1566 0.0770 0 -9.210240 1 23.803741 225.1231 16.88028 0.1058 0.1370 0.2139 0.2387 0.2654 0.2933 0.3235 0.2928 0.3093 0.1601 NA NA NA 20.789165 306.0945 18.52480 0.0287 0.0279 0.0271 0.0276 0.0290 0.0321 0.0346 0.0452 0.0475 0.0219 NA -9.210240 1 6.689442 287.9641 36.08975 0.0462 0.0679 0.1274 0.1535 0.1797 0.2201 0.2982 0.2545 0.4170 0.2252 0 -9.210240 1 25.476444 203.0659 23.59964 0.0758 0.1041 0.1326 0.1571 0.2143 0.2486 0.2939 0.2536 0.3336 0.1937 1 -1.385919 3 1.672511 270.0000 39.55215 0.0466 0.0716 0.1227 0.1482 0.2215 0.2715 0.3334 0.2903 0.3577 0.1957 中提到了def change_password,也没有看到调用发生。

Views.py

action

模式对话框:

def change_password(request):
    if request.method == 'POST':
        form = PasswordChangeForm(request.user, request.POST)
        if form.is_valid():
            user = form.save()
            update_session_auth_hash(request, user)  # Important!
            messages.success(request, 'Your password was successfully updated!')
            return redirect('change_password')
        else:
            messages.error(request, 'Please correct the error below.')
    else:
        form = PasswordChangeForm(request.user)
    return render(request, 'usermgmt/change-password.html', {
        'form': form
    })

模板:

<div id="passwordChangeModal" class="modal fade" role="dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Change Password</h4>
      </div>
      <div class="modal-body">
          <form action="{% url 'usermgmt:change_password_page' %}" method="post" id="changepassword" class="form">
              {% csrf_token %}
          {{ form }}
          </form>

      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>


</div>

这就是我所说的模态:

{% extends 'base.html'%}
<h1>Hello From Change Password</h1>
<form method="post">
  {% csrf_token %}
  {{ form.as_p }}
  <button type="submit">Save changes</button>
</form>

1 个答案:

答案 0 :(得分:0)

我想问题在于除非您通过JS提交该表单,否则模态表单中缺少提交按钮。

编辑:通过添加上下文处理器,在基本模板中添加了PasswordChangeForm实例可访问性的问题的解决方法。
我使用名为context_processors.py的新上下文处理器在应用程序的文件夹中创建了文件usermgmt(在您的情况下为password_form)(您可以随意使用任何名称,请务必反映出此更改同样在settings.py中,还有更多详细信息):

from django.contrib.auth.forms import PasswordChangeForm


def password_form(request):
    return {
        'pwd_form': PasswordChangeForm(request.user),
    }  

然后我在核心settings.py TEMPLATES / OPTIONS / context_processors部分中插入了一行,现在看起来像这样:

'OPTIONS': {
    'context_processors': [
        'django.template.context_processors.debug',
        'django.template.context_processors.request',
        'django.contrib.auth.context_processors.auth',
        'django.contrib.messages.context_processors.messages',
        'usermgmt.context_processors.password_form'
    ],
},  

现在,您可以在任何模板中使用pwd_form,包括您的base.html。根据您的代码(注释),我制定了base.html的模式部分:

<div id="passwordChangeModal" class="modal fade" role="dialog">
    <div class="modal-dialog" role="document"> <!-- without this div I wasn't able to close opened modal -->
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                <h4 class="modal-title">Change Password</h4>
            </div>
            <div class="modal-body">
                <form method="post" action="{% url 'change_password' %}" class="form">
                    {% csrf_token %}
                    {{ pwd_form }}
                    <button type="submit" class="btn btn-default">Save</button> <!-- note lack of data-dismiss="modal" - with this attr set I wasn't able to submit form as modal just got closed all the time - probably because of the precedence of modal-related attrs, but I couldn't find any docs regarding this behaviour -->
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>