如何使用SilverStripe有效地在表单上的提交按钮中添加额外的自定义JQuery功能
How to effectively add additional custom JQuery function to Submit Button on Forms with SilverStripe
我正在使用SilverStripe 3.0和SilverStripe userforms子模块。这真的很难解释,所以请耐心等待。
我想在Form中添加一个自定义函数(检查文本区域字数),但我不确定如何最好地附加该函数,因为我不想破解核心验证js文件。
$('button[type="submit"]').entwine({
onclick: function () {
var $this = $('textarea.max-words');
var wordcount = getWords($this);
if (wordcount > maxWords) {
if ($this.next().is("span")) {
$('#maxwords-error').html(function () {
return spanText(wordcount, maxWords);
});
}
else {
$this.after(function () {
return "<span id='maxwords-error' class='required message'>" + spanText(wordcount, maxWords) + "</span>"
});
return false;
}
}
}
})
银条使用纠缠库,所以我也尝试过这样做。
我的问题是这个
- 运行时,首先提示用户按照上述功能完成所需的字数计数
- 满足此条件后,将根据模块表单字段运行其他附加验证(例如,需要向电子邮件字段添加有效的电子邮件地址)
- 用户可以根据自定义功能完成字数统计,但如果验证的另一部分失败(例如,电子邮件字段不包含有效的电子邮件),用户可以添加电子邮件,但随后更改字数并成功提交。一旦函数成功,它似乎就再也不会运行了
如何让我的自定义函数在每次按下提交按钮时运行,无论之前的字数是正确的还是不正确的。
我认为您还应该取消点击事件,这样它就不会被传播。类似这样的东西(简化):
$('button[type="submit"]').entwine({
onclick: function (evt) {
if(wordCountValidationFailed){
evt.preventDefault();
evt.stopPropagation();
evt.stopImmediatePropagation();
return false;
}
}
});
这样可以确保一旦字数检查失败,事件管道的执行就会停止。如果除字数外的所有表单字段都有效,则应防止提交表单。
相关文章:
- 向现有事件侦听器添加功能
- 新手帮助向jQuery添加功能
- 通过访问DOM添加功能
- 如何为聚合物元素添加功能属性
- 向地图框添加功能.js
- 为什么你不应该向JavaScript构造函数添加功能,而是通过原型
- 为通讯录添加功能
- 向 JavaScript 中的预定义事件添加功能
- 在state.go(ui路由器)之后添加功能
- 意外的令牌''在向原型添加功能时
- 在JQuery日期选择器中再添加一个事件当前添加功能不起作用
- 如何在引导模式中添加功能- Laravel
- 添加功能,如果歌曲/轨道结束
- 向JavaScript日历添加功能
- 在windows上添加功能.Load只适用于相同的javascript
- 向Javascript原型添加方法和向现有对象添加功能之间的区别是什么?
- 如何在jquery中传递html数据表的行添加功能
- 使用原型添加功能
- 用React以类似于markdown的方式为用户注释添加功能
- 使用Angular向各个列表项添加功能