[英]How Set focus to CharField of a django form element
我的登录页面使用 Django 的表单。 I want to set focus to the first textField (username) when the page loads.
我尝试使用 Jquery 如下,但没有得到结果。
forms.py:
from django import forms
class LoginForm(forms.Form):
userName = forms.EmailField(max_length=25)
password = forms.CharField( widget=forms.PasswordInput, label="password" )
登录.html
% block headextra %}
<script type="text/javascript">
$(document).ready(function() {
window.onload = function() {
$("#id_username").focus();
// alert('test') if I add this line its works
// setting focus to a textbox which added to template page direcltly using html tag the focus() method works well
};
});
</script>
{% endblock %}
{% block content %}
<form method = "POST" action ="/login/">{% csrf_token %}
<table align ="center">
{{ form.as_table }}
<tr><td></td></tr>
<tr><td><input type="submit" value="Submit"></td></tr>
</table>
</from>
回答这个问题的正确 Django 方法如下(因为它不依赖于启用的 js):
from django import forms
class LoginForm(forms.Form):
user_name = forms.EmailField(max_length=25)
password = forms.CharField( widget=forms.PasswordInput, label="password" )
def __init__(self):
self.fields['user_name'].widget.attrs.update({'autofocus': 'autofocus'
'required': 'required', 'placeholder': 'User Name'})
self.fields['password'].widget.attrs.update({
'required': 'required', 'placeholder': 'Password'})
此外,为了记录,我们避免对对象属性使用驼峰式大小写。 干杯!
password = forms.CharField(
widget=forms.PasswordInput(attrs={'autofocus': 'autofocus'}))
对于文本输入:
field = forms.CharField(
widget=forms.TextInput(attrs={'autofocus': 'autofocus'}))
我只是想使用默认的 Django 登录表单,但是添加了 autofocus 属性,所以我从默认值派生了一个新的表单类。
#myapp/forms.py
from django.contrib.auth.forms import AuthenticationForm
class LoginForm(AuthenticationForm):
def __init__(self, *args, **kwargs):
super(LoginForm, self).__init__(*args, **kwargs)
self.fields['username'].widget.attrs.update({'autofocus': ''})
然后我在urls.py
指定了新的表单类:
from myapp.forms import LoginForm
urlpatterns = patterns(
'',
url(r'^login/$', 'django.contrib.auth.views.login',
{"template_name": "myapp/login.html",
"authentication_form": LoginForm,
"current_app": "myapp"}, name='login'),
#...
)
在 html 中,您所需要的只是不带参数的autofocus
。
在 Django 表单中,添加 autofocus 作为键,值为空:
search = forms.CharField(
label='Search for:',
max_length=50,
required=False,
widget=forms.TextInput(attrs={'autofocus': ''}))
$("#id_username")
应该是$("#id_userName")
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.