jquery-validate 相关问题

jQuery Validate插件是JörnZaefferer的jQuery插件。其目的是对用户输入的数据执行客户端表单验证。

模态弹出表单的 jquery 验证

函数 submitAddStudent() { $("#modalForm").validate({ 规则:{ 姓名: { 要求:真实, 带空格的字母:真 }, 电子邮件: { </desc> <question vote="0"> <pre><code>&lt;script&gt; function submitAddStudent() { $(&#34;#modalForm&#34;).validate({ rules: { name: { required: true, letterswithspace: true }, email: { required: true, email: true }, phone: { required: true, minlength: 10, maxlength: 10, digits: true } }, messages: { name: { required: &#34;Please enter a name.&#34;, letterswithspace: &#34;Please enter a valid name with letters and spaces only.&#34; }, email: { required: &#34;Please enter an email address.&#34;, email: &#34;Please enter a valid email address.&#34; }, phone: { required: &#34;Please enter a phone number.&#34;, minlength: &#34;Please enter a valid 10-digit phone number.&#34;, maxlength: &#34;Please enter a valid 10-digit phone number.&#34;, digits: &#34;Please enter a valid 10-digit phone number.&#34; } }, errorElement: &#34;span&#34;, errorClass: &#34;help-block&#34;, highlight: function(element, errorClass, validClass) { $(element).closest(&#34;.form-group&#34;).addClass(&#34;has-error&#34;); }, unhighlight: function(element, errorClass, validClass) { $(element).closest(&#34;.form-group&#34;).removeClass(&#34;has-error&#34;); } }); } &lt;/script&gt; </code></pre> <p>完整代码:<a href="https://jsfiddle.net/wxber8yp/1/" rel="nofollow noreferrer">https://jsfiddle.net/wxber8yp/1/</a> 在上面的链接中包含 HTML 和脚本文件供您参考。</p> <p>在模态弹出窗体中,它不验证表单字段,我无法添加学生(添加学生)按钮在模态弹出窗体中不起作用。我期望表单应该通过 jquery 验证进行验证,并且应该将数据添加到数据库中。</p> </question> </body></html>

回答 0 投票 0

如何使用 bootstrap 5 验证确保至少两个输入字段之一不为空

我正在使用“必需”属性对同一表单中的其他输入字段使用引导程序验证。但对于这两个字段(valueOTC 和 valueMRC),如果至少有一个不为空,那么表格应该是

回答 0 投票 0

Bootstrap 模式中的 jQuery 验证不会触发

好的,所以我正在尝试使用 jQuery Validation 来验证我在模态中的表单。但是,我的 jQuery Validation 甚至根本没有触发,甚至没有错误。我已经使用了调试,并且有一个警告...

回答 2 投票 0

提交前的验证表没有显示任何验证信息?

我在应用程序上使用了 jQuery 验证库,但是当我在提交前验证时不起作用。当检查下面这个文件的第 1 行的元素时,需要一些帮助。 $(函数(){ $...

回答 1 投票 0

为 Summernote 添加 JQuery 验证方法

我正在尝试向 Summernote 添加一个验证器方法,以确保控件中有内容,并使用验证工具提示进行警告,如果数据不存在,则停止提交表单...

回答 0 投票 0

jQuery - 在 AJAX 调用后将 10k 行附加到表中

我有一个网页将接收 10k 行 CSV 数据,我必须在成功调用 ajax 后调用 API 以获取更多详细信息我必须附加所有这些 10k 行(5 列 - 4 个输入字段与

回答 0 投票 0

为什么 JQuery Validate 在 .Net Core MVC 中标记默认需要的输入字段

我有一个简单的视图,它绑定到一个模型,其中不需要任何属性(并且都是 [nullable] 字符串)。默认情况下,生成的标记会根据需要标记问题字段,即使您...

回答 1 投票 0

jquery 验证器组 - 如何使用它?

我有 3 个字段和按钮: 我有 3 个字段和按钮: <input type="text" id="a" /> <input type="text" id="b" /> <input type="text" id="c" /> <input type="button" id="d" /> <label for="all_fields" class="error" style="display:none;">Please fill exactly one field</label> 我想使用 jquery 验证器插件来验证只有一个字段填充了文本。最好的方法是什么? 工作演示for A / B / C案例:http://jsfiddle.net/hfLwB/ 行为:只要其中一个输入字段设置为 nu,她的值就会允许计算发生,如果所有 3 个字段都为空,则会发生错误。您还会注意到类.at_least_one和addMthod:require_from_group. Anyhoo 代码应该说得更好。 好的链接:http://docs.jquery.com/Plugins/Validation 希望对您有所帮助:) HTML <form action="results.whatever" target="_blank" id="HULK"> <div style="clear:both"> <label for="a">A</label> <div style="float:right"> <input name="a" type="text" class="at_least_one idleField"></div> </div> <div style="clear:both"> <label for="b">B</label> <div style="float:right"> <input name="b" type="text" class="at_least_one idleField"> </div> </div> <div style="clear:both"> <label for="c">C</label> <div style="float:right"> <input name="c" type="text" class="at_least_one idleField"> </div> </div> <div id="button"> <input name="" type="submit" value="Calculate" class="calc_button" style="cursor:hand"> </div> </form> <div id="errorContainer"> <h4>errors</h4> <ol> </ol> </div> 代码 jQuery.validator.addMethod("require_from_group", function(value, element, options) { var numberRequired = options[0]; var selector = options[1]; var fields = $(selector, element.form); var filled_fields = fields.filter(function() { // it's more clear to compare with empty string return $(this).val() != ""; }); var empty_fields = fields.not(filled_fields); // we will mark only first empty field as invalid if (filled_fields.length < numberRequired && empty_fields[0] == element) { return false; } return true; // {0} below is the 0th item in the options field }, jQuery.format("Please fill out at least {0} of these fields.")); $(document).ready(function(){ var container = $('#errorContainer'); $("#HULK").validate( { // We must to force validation of entire form because // when we remove value from 2-nd field // the 1-st field becomes invalid. onfocusout: function() { $("#HULK").valid() }, onkeyup: function() { $("#HULK").valid() }, rules: { // note: you can use variable to avoid repeating // of the same code a: { number: true, require_from_group: [1, ".at_least_one"] }, b: { number: true, require_from_group: [1,".at_least_one"] }, c: { number: true, require_from_group: [1,".at_least_one"] } }, success: function(label) { label.html(" ").addClass("checked"); }, errorContainer: container, errorLabelContainer: $("ol", container), wrapper: 'li', meta: "validate" }); }); 只是为了在@Tats_innit 帖子中添加更多道具。 require_from_group additional-method-1.10.js 的 1.10.0 发布版本在 github 上有一个未解决的问题。 github问题: require_from_group 禁用其他规则 smileyanp@github 在他的解决方案中引用了这篇文章,他重用了@Tats_innit 的函数并创建了一个 test 表明它可以正常工作 并且不会禁用 对 jquery.validation 之前定义的其他规则的验证。 这篇文章在这里是为了节省时间,因为这样一个小细节需要 3 个小时的谷歌搜索.. 修复: 只需更新require_from_group或在additional-method-1.10.js加载后执行此代码(以覆盖功能)。 additional-method-1.10.js 我试图将 require_from_group 用于 magento 站点,但即使使用此修复程序也无法使其正常工作。在浪费了太多时间之后,我使用 html 中的 title 属性将其缩小到 magento。然后我遇到了这个jquery验证,当输入字段有一个标题属性时,而不是错误消息标题作为错误消息. 我希望这可以帮助其他人节省时间!!

回答 3 投票 0

在不同步骤上带有两个术语复选框的多步表单无法使用 jQuery 验证插件正确验证?

有两个复选框的表格,用于就不同步骤(第一个和最后一个)达成一致。第一个工作完全正常,但最后一步工作不正常。 这是html代码 有两个复选框的表格,用于就不同步骤(第一个和最后一个)达成一致。第一个工作完全正常,但是最后一步工作不正常。 这里是html代码 <form method="post" id="prizeRegistration" action="submit_book.php" enctype="multipart/form-data"> <fieldset id="step1" class="publisher"> <div class="stepSec01"> <div class="row"> <div class="col-md-4"> <div class="form-group"> <label for="email">Are you a Publisher?<span class="strik">*</span></label> <div class="check"> <ul class="radioCls"> <li> <input type="radio" id="Yes" checked="" name="publisher" value="yes"> <label for="Yes"> <span></span>Yes</label> </li> <li> <input type="radio" id="No" name="publisher" value="no"> <label for="No"> <span></span>No</label> </li> </ul> <div class="error" id="error_publisher"></div> </div> </div> </div> .... .... .... <div class="col-md-12"> <div class="form-group"> <div class="checkbox"> <p>By checking the box below, you hereby declare that all information submitted by you holds true.<span class="strik adStrik">*</span></p> <input type="checkbox" id="agreement" name="agreement" value="agree" /> <label for="agreement"> <span></span>I agree</label> </div> <div class="error" id="error_agreement"></div> </div> <div class="form-group"> <a href="javascript:void(0)" id="stepone" class="btn next">Next</a> </div> </div> </div> </div> </fieldset> <fieldset id="step2" class="book" style="display:none;"> ... </fieldset> <fieldset id="step3" class="author" style="display:none;"> .... </fieldset> <fieldset id="step4" class="editor" style="display:none;"> ..... </fieldset> <fieldset id="step5" class="declaration" style="display:none;"> <div class="stepSec05"> <div class="row"> <div class="col-md-12"> <div class="form-group"> <div class="checkbox"> <p>I hereby declare that all information submitted as part of the form is true to my knowledge. Any information shared with me (as a representative of my Publishing House) will be kept confidential. A breach in the same will lead to the disqualification of the entries made by the Publishing House, for the foreseeable future.<span class="strik">*</span> </p> <input type="checkbox" id="declaration" name="declaration" value="agree" /> <label for="declaration"><span></span>I Agree</label> <div class="error" id="error_declaration"></div> </div> </div> <div class="form-group"> <button type="submit" id="stepfive" class="btn">Submit</button> </div> </div> </div> </div> </fieldset> </form> 这里是 jQuery 验证码 <script> $(document).ready(function() { $(".error").removeClass("error"); $(".next").click(function() { var form = $("#prizeRegistration"); jQuery.validator.addMethod("agreement", function(value, element) { if ($("#agreement").is(":checked")) { return true; } else { return false; } }, "Please check the box."); jQuery.validator.addMethod("declaration", function(value, element) { //var ckb_status = $("#declaration_agreement").prop('checked'); if ($("#declaration").is(":checked")) { return true; } else { return false; } }, "Please check the box."); jQuery.validator.addMethod("lettersonly", function(value, element) { return this.optional(element) || /^[a-zA-Z ]*$/.test(value); }, "Letters only please"); $.validator.addMethod('filesize', function(value, element, param) { return this.optional(element) || (element.files[0].size <= param * 1000000) }, 'File size must be less than {0} MB'); form.validate({ // ignore: [':not(checkbox:hidden)'], submitHandler: function() { $('.loaderhome').show(); form.submit(); }, focusCleanup: true, errorPlacement: function(error, element) { var name = $(element).attr("name"); error.insertAfter($("#error_" + name)); }, rules: { email: { required: true, email: true, }, publisher: { required: true, }, pbh_name: { required: true, lettersonly: true }, imprint_name: { required: true, lettersonly: true }, reg_address: { required: true, }, reg_phone: { required: true, number: true, maxlength: 10, minlength: 10 }, contact_person: { required: true, lettersonly: true }, cp_email: { required: true, email: true, }, cp_phone: { required: true, number: true, maxlength: 10, minlength: 10 }, proof: { required: true, filesize: 2 }, agreement: { required: true, }, published: { required: true, }, english: { required: true, }, book_title: { required: true }, published_date: { required: true, }, publishing_date: { // required: true }, isbn_code: { required: true, number: true, maxlength: 13, minlength: 10 }, orignal_title: { lettersonly: true }, original_lang: { lettersonly: true }, original_publisher: { lettersonly: true }, original_pub_date: { }, original_isbn_code: { number: true, maxlength: 13, minlength: 10 }, other_territory_pub: { required: true, }, territory_of_pub: { lettersonly: true }, other_territory_date_of_pub: { }, book_cover: { required: true, filesize: 2 }, ebook: { required: true, filesize: 2 }, author_name: { required: true, lettersonly: true }, author_date_of_birth: { required: true, }, author_email: { required: true, }, author_address: { required: true, }, author_proof_of_citizen: { required: true, filesize: 2 }, editor_name: { required: true, lettersonly: true }, editor_email: { required: true, email: true, }, editor_contact_number: { required: true, number: true, maxlength: 10, minlength: 10 }, declaration: { required: true, } }, }); console.log(form); if (form.valid() === true) { if ($('#step1').is(":visible")) { current_fs = $('#step1'); next_fs = $('#step2'); $('#publisher').removeClass('active'); $('#publisher').addClass('grnactive'); $('#book').addClass('active'); } else if ($('#step2').is(":visible")) { current_fs = $('#step2'); next_fs = $('#step3'); $('#book').removeClass('active'); $('#book').addClass('grnactive'); $('#author').addClass('active'); } else if ($('#step3').is(":visible")) { current_fs = $('#step3'); next_fs = $('#step4'); $('#author').removeClass('active'); $('#author').addClass('grnactive'); $('#editor').addClass('active'); } else if ($('#step4').is(":visible")) { current_fs = $('#step4'); next_fs = $('#step5'); $('#editor').removeClass('active'); $('#editor').addClass('grnactive'); $('#declaration').addClass('active'); } else if ($('#step5').is(":visible")) { current_fs = $('#step5'); next_fs = $('#step1'); $('#declaration').addClass('active'); $('#declaration').addClass('grnactive'); } next_fs.show(); current_fs.hide(); } }); $('.backBtn').click(function() { if ($('#step5').is(":visible")) { current_fs = $('#step5'); next_fs = $('#step4'); } else if ($('#step4').is(":visible")) { current_fs = $('#step4'); next_fs = $('#step3'); } else if ($('#step3').is(":visible")) { current_fs = $('#step3'); next_fs = $('#step2'); } else if ($('#step2').is(":visible")) { current_fs = $('#step2'); next_fs = $('#step1'); } next_fs.show(); current_fs.hide(); }); }); </script> 我试图更改名称,因为,id。当我们到达最后一步声明块时,它会自动添加有效类。我希望它在提交时显示错误而不检查它。但是,它仅在您单击或切换复选框时起作用。

回答 0 投票 0

表格中的复选框验证

我有一个这样的代码,不能验证复选框字段,而它是检查。你能帮助我吗?我的意思是只有复选框输入字段中的#check id。有些东西不工作我。电子邮件的工作...

回答 1 投票 0

尝试用jquery验证方法验证regex模式(数字、文件类型、针码等)。

我试图创建一个方法,通过与我应能够验证所有的自定义模式。只是要改变模式和各自的消息,以显示当前列表的东西,我...

回答 1 投票 1

输入元素阵列的JQuery验证

我需要验证一个数组的输入文本元素(里程数)。例如:

回答 4 投票 7

jQuery验证插件与自定义属性[关闭]。

我想用jQuery Validation插件来处理这个HTML。 如你所见,我使用了一个自定义......

回答 1 投票 2

jquery验证文件输入不起作用[重复]。

嗨,我有一个html表格,有一个输入文件和许多字段.我打算验证它的jquery表单验证器插件。它的工作原理像一个魅力的文本输入和选择,但它只是验证文件......

回答 1 投票 0

jQuery验证数据属性中的自定义规则

我有一个已经有一些验证规则的输入文本

回答 1 投票 5

如何验证joomla默认文本编辑器?

我在使用joomla默认编辑器的表单和jquery验证器插件,现在我想验证joomla文本编辑器不应该是空白的......我怎么验证呢? 我看了一篇文章,关于......

回答 2 投票 1

如何验证分组中的独立字段?

我有两个输入字段:first_name和last_name。我对它们进行了如下的验证:规则:{ required: true, maxlength: 50 }, groups : { name : "first_name", last_name": { required: true, maxlength: 50 }, groups : { name : "first_name last_name" }, errorElement: "p",...

回答 1 投票 0

当页面加载时,jQuery自动运行变化事件的功能。

我做了一个函数,用来验证不同类型的字符串的输入。我在一些事情上遇到了严重的问题。我在表单提交时调用该函数,在更改时调用该函数。我已经写好了我的...

回答 2 投票 0

jQuery Validate - 成功事件?

我在网站上使用jQuery Validate插件,然后通过ajax提交表单。当整个表单有效的时候,我可以使用一个事件吗?

回答 5 投票 13

试图上传图片时未定义索引(使用jquery验证和步骤

我在使用jquery steps和jquery validate的表单步骤。但是当我尝试上传图片时,它显示 "Undefined Index: picture"。当我尝试不使用这两个jquery时,它可以工作。 register.php

回答 1 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.