[英]How to enable/disable button with checkbox using JS inside Django crispy form?
I am trying to implement this: http://jsfiddle.net/8YBu5/7/ 我正在尝试实现这一点: http : //jsfiddle.net/8YBu5/7/
I would like to enable / disable a django crispy forms submit button based on a checkbox in the same crispy form. 我想启用/禁用基于同一脆脆窗体中的复选框的django脆脆窗体提交按钮。
Is it possible? 可能吗? how do I get this JS to work?
我该如何使用此JS?
The JS doesn't seem to do anything. JS似乎什么也没做。 I feel like I am missing something basic here...
我觉得我在这里缺少基本的东西...
here is my crispy form: 这是我的脆皮形式:
email = forms.EmailField(label=_("Email"))
password1 = forms.CharField(widget=forms.PasswordInput,label=_("Password"))
billing_secret = forms.CharField()
termsandcond = forms.TypedChoiceField(
label = False,
choices = ((1, "Yeah sure"),),
initial = '0',
)
def __init__(self, *args, **kwargs):
billing_secret = kwargs.pop('billing_secret', None)
super(RegistrationForm, self).__init__(*args, **kwargs)
self.helper = FormHelper()
self.helper.form_method = 'post'
self.helper.form_action = '.'
self.helper.layout = Layout(
Field('email', placeholder=_("Email")),
Field('password1', placeholder=_("Password")),
InlineCheckboxes('termsandcond'),
Submit("save", _("Get Started"),css_class="pull-right", css_id="postme"),
)
here is my JS: 这是我的JS:
$('#id_termsandcond_1').click(function(){
if($(this).attr('checked') == false){
$('#postme').attr("disabled","disabled");
}
else {
$('#postme').removeAttr('disabled');
}
});
here are the relevant rendered django crispy form elements: 以下是相关的渲染django脆皮表单元素:
<div id="div_id_termsandcond" class="form-group">
<div class="controls ">
<label class="checkbox-inline">
<input type="checkbox" name="termsandcond" id="id_termsandcond_1" value="1">Yeah sure
</label>
</div>
</div>
<input type="submit" name="save" value="Get Started" class="btn btn-primary pull-right" id="postme">
This works. 这可行。 You need to use .prop('checked').
您需要使用.prop('checked')。
<html>
<body>
<form action="/somehandler.html" method="get">
<div id="div_id_termsandcond" class="form-group" >
<div class="controls ">
<label class="checkbox-inline">
<input type="checkbox" name="termsandcond" id="id_termsandcond_1" value="1">Yeah sure
</label>
</div>
</div>
<input type="submit" name="save" value="Get Started" class="btn btn-primary pull-right" id="postme">
</form>
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script type="text/javascript">
$('#postme').attr('disabled', 'disabled');
$('#id_termsandcond_1').click(function(){
if($(this).prop('checked') === false){
$('#postme').attr('disabled', 'disabled');
}else {
$('#postme').removeAttr('disabled');
}
});
</script>
</body>
</html>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.