Ajax 无法与 jquery 验证插件一起使用

2024-07-01

我的 ajax 成功/失败事件没有触发。我正在使用 jquery 验证,并在其中使用 ajax 进行表单提交。 我的表单已提交,但返回值(JSON 数据)未按照 AJAX 中的描述显示。

我尝试使用alert(),但它也没有触发。

<script type="text/javascript">
$('document').ready(function()
{

    $("#alert-form").validate({
          ignore: '',
          messages: {
            select2Start: {
              required: "Please select your starting point.",

            }
          },

        //});
        submitHandler: function(form) {

                e.preventDefault;
                var btn = $('#publish');
                btn.button('loading');
                alert('valid form submission');

                $.ajax({
                    type: 'post',
                    url:$('form#alert-form').attr('action'),
                    cache: false,
                    dataType: 'json',
                    data: $('form#alert-form').serialize(),
                    beforeSend: function() { 
                        $("#validation-errors_alert").hide().empty(); 
                    },
                    success: function(data) {
                        if(data.success == false)
                            {
                                var arr = data.errors;
                                $.each(arr, function(index, value)
                                {
                                    if (value.length != 0)
                                    {
                                        $("#validation-errors_alert").append('<div class="alert alert-danger"><strong>'+ value +'</strong><div>');
                                    }
                                });
                                $("#validation-errors_alert").show();   
                                btn.button('reset');                            
                            }else{
                            //  alert("Job Alert Configured successfully.");
                                 $("#job_success_alert").append('<div class="alert alert-success"><strong>Alert Configured successfully.</strong><div>');
                            }
                    },
                    error: function(xhr, textStatus, thrownError) {
                    alert('Something went to wrong.Please Try again later...');
                        alert(thrownError);
                        btn.button('reset');

                    }
                });             
                return false;
        }
            });

        });

    </script>   

正如 Barmer 在他的第一条评论中指出的那样,这段代码存在几个问题......

 submitHandler: function(form) {
     e.preventDefault;
     ....
  1. 多变的e此范围内不存在submitHandler功能。

  2. 您未能将括号包含在.preventDefault().

  3. 你不需要.preventDefault()在这种情况下,因为插件已经阻止了默认提交。完全删除此行。

NOTES:

为了获得良好的可读性,不要将 Allman 与 1TBS 风格的代码格式混合在一起......只需始终保持一致即可。此外,最好是避免在 JavaScript 中使用 Allman https://stackoverflow.com/a/11247362/594235共。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Ajax 无法与 jquery 验证插件一起使用 的相关文章

  • jQuery:在隐藏元素之前我应该​​检查可见性吗?

    最好的做法是在隐藏元素之前检查它是否可见 还是直接隐藏它就可以了 两种方式有什么好处 在下面的示例中 首先在隐藏之前检查可见性 foo元素 dropdown hover function this find menu fadeToggle
  • 在动画期间更改 jQuery 的动画持续时间

    是否可以更改duration当前正在运行的两个不同值之间的 jQuery 动画 我尝试过改变duration通过直接赋值 但没有成功 var timing duration 4000 document click function e ti
  • 使用 jQuery 标准化 CodeMirror OnKeyEvent

    我在用着码镜 http codemirror net与 jQuery 一起为宠物 PoC 项目提供语法突出显示 它一直做得很好 直到我意识到 CodeMirror 似乎正在以一种停止的方式捕获 DOM 上的按键事件global当我当前在启用
  • 如何使用 JavaScript 对元素重新排序?

    我如何在不改变 HTML 源代码的情况下重新排序 div 例如 我希望 div 按 div2 div1 div3 的顺序出现 但在 HTML 中它们是 div div div div div div Thanks 没有一种通用的方法可以使用
  • 使用 jQuery 将 HTML 页面动态加载到 div 中

    我试图做到这一点 以便当我单击 HTML 页面中的链接时 它会使用 jQuery 将请求的页面动态加载到 div 中 我怎样才能做到这一点 div div a href page1 html Page 1 a br a href page2
  • 带标头认证的跨域请求

    我需要发送一个Get具有标头身份验证的跨域来源请求 它在 Chrome 和 Firefox 中工作正常 但在 Safari 和 IE 中遇到问题 同样在随机情况下它会返回 401 解决这个问题的最佳选择是什么 如果我正确理解了问题 您可以使
  • 了解 HTML 5 事件拖动

    我不明白为什么在事件拖动中鼠标坐标clientX的返回值总是0或释放鼠标之前的负值 我准备了一个例子 当用户dragstart 鼠标位置正确 结束同样dragend 但是如果你查看控制台drag你会看到之前dragend负值 是正常行为吗
  • 如何使用 jQuery 定期更新页面上的日期/时间值?

    在此示例中 我有一个输入文本字段 其中包含使用 jQuery 设置的日期时间值 http jsfiddle net D4Hu9 http jsfiddle net D4Hu9 HTML
  • Jquery UI 选项卡在 AngularJS 中不起作用

    我在 angularJS 中使用 jquery UI 选项卡 并使用 ng repeat 生成列表项和选项卡容器 选项卡可以正常工作 但选项卡容器无法正常工作 模板 tabs html ul li a class pageName href
  • 在 PHP 中格式化 JSON 格式的文本文件

    所以我得到了一个带有按钮的 HTML 页面 当我单击该按钮时 一个单独的 javascript 文件会向我的 PHP 文件发送 GET 请求 并期望返回 JSON 对象 我的 PHP 读取 JSON 格式的文本文件 并将其转换为 JSONO
  • jQuery 事件在 mouseup 时停止

    我正在尝试制作一个非常简单的应用程序 当鼠标按钮按下时 用户可以使用选定的颜色绘制到表格中 当鼠标松开时事件停止 绘图效果很好 唯一的问题是释放鼠标时事件不会停止 我已经尝试过很多方法 但显然我做错了 还尝试了绑定和取消绑定事件 但也不起作
  • 冻结 TH 标题和滚动数据

    我有一个 html 表 我想冻结标题行标签以滚动数据 我怎样才能做到这一点 我需要使用Dom吗 谢谢 我的解决方案是使用两个表并固定列宽 下面的表格位于可滚动的 div 中 并且没有标题
  • 将元素粘贴到滚动上固定元素的底部?

    基本上 我想要实现的目标是让辅助导航在滚动时与主导航的底部相遇后立即粘在主导航的底部 我仍在学习 jQuery 并且我已经开始抓狂了 编辑 意识到我没有解释到目前为止我已经到了哪里 该类被添加到元素中 但是它没有固定在主标题下方 而是从视口
  • 如何创建 Ajax 弹出表单并提交表单

    我喜欢请求一个 ajax popup bij 单击带有变量的链接 弹出窗口将显示服务器请求的一些日期 提交后 服务器将检查数据并发送回响应 根据响应 新内容将显示在弹出窗口中 用户可以随后关闭弹出窗口 我已经搜索了一段时间的教程或示例 但找
  • 邪恶的 Firefox 错误——“底层对象不支持参数或操作”

    我想弄清楚这里发生了什么事 我已经研究了几个小时了 似乎无法理解为什么会发生这种情况 我正在进行一些 AJAX 调用 但仅在 Mac OS X 上的 Firefox 版本 21 中不断收到此错误 这是错误 Exception A param
  • 使重复的scrollBy像jQuery的动画scrollTop一样平滑

    如何使重复的scrollBy调用更平滑 就像使用jQuery的animatescrollTop制作动画一样 目前它是跳跃的 页面在不同的滚动位置之间跳转 我怎样才能让它更顺畅 这是滚动代码 window scrollBy 0 10 scro
  • 多个选择器:确定触发选择器?

    这是一个我无法弄清楚的小问题 我相信很快就会有人回答 有多个选择器 例如 a button span xyz a another click function e var clicked element 我如何找出实际单击了哪个选择器 我需
  • 如何在单击时和用户单击离开时关闭菜单?

    我有以下代码 function document ready function clicker class click function show menu users show jQuery clicker class click fun
  • HTML / Javascript - 通过单击父行来展开和折叠表行(子行)

    我几天来一直在尝试解决一个问题 终于明白 如 果没有帮助 我将不会成功 我想做一件我们每天在互联网上看到的常见事情 能够单击表格行以显示更多详细信息 但这里的更多细节并不意味着文本块 而是指与父行具有相同形状的子行 以下是 HTML 表格的
  • 为 div 标签设置属性

    我有一个简单的代码 div class content div 我想使用 javascript 回显 div 标签内的某些内容以显示这种方式 div class content div 我需要使用 javascript 因为如果屏幕宽于 9

随机推荐