jQuery.validate 插件和 ajax 表单提交

2023-12-11

我一生都无法让它发挥作用。验证错误看起来很好,我没有收到语法错误,但什么也没有发生。表单只是提交到页面。我也无法获得成功或错误警报......

<form id="contact" class="validation" method="post" action="">
<fieldset>
<ol class="comment_fields">
    <li>
        <label for="name">Name: <span>(required)</span></label>
        <input type="text" name="name" id="name" class="required" minlength="4" tabindex="1" />
    </li>
    <li>
        <label for="email">E&ndash;Mail: <span>(required / private)</span></label>
        <input type="text" name="email" id="email" class="required email" tabindex="2" />
    </li>
    <li>
        <label for="subject">Subject: <span>(required)</span></label>
        <input type="text" name="subject" id="subject" class="required" minlength="4" tabindex="3" />
    </li>
    <li class="comment_area">
        <label for="comment">Message: <span>(required)</span></label>
        <textarea name="message" id="message" rows="8" cols="8" class="required" minlength="10" tabindex="4"></textarea>
        <cite>Please, no XHTML.</cite>
    </li>
    <li class="submit">
        <input type="submit" class="button blue" value="Send Message" id="submit" tabindex="5" />
    </li>
</ol>
</fieldset>
</form>

<script type="text/javascript">

$("#contact").validate({
    rules: {
    name: {required: true},
    email: {required: true},
    subject: {requred: true},
    submitHandler: function() {
        $.ajax({
            type: "POST",
            url: "<?php bloginfo("template_directory"); ?>/contact/process.php",
            data: formSerialize,
            timeout: 3000,
            success: function() {alert('works');},
            error: function() {alert('failed');}
        });

        return false;
    }
}
});

</script>

这是process.php:

<?php
    if ((isset($_POST['name'])) && (strlen(trim($_POST['name'])) > 0)) {
        $name = stripslashes(strip_tags($_POST['name']));
    } else {$name = 'No name entered';}

    if ((isset($_POST['email'])) && (strlen(trim($_POST['email'])) > 0)) {
        $email = stripslashes(strip_tags($_POST['email']));
    } else {$email = 'No email entered';}

    if ((isset($_POST['message'])) && (strlen(trim($_POST['message'])) > 0)) {
        $message = stripslashes(strip_tags($_POST['message']));
    } else {$message = 'No message entered';}

    if ((isset($_POST['subject'])) && (strlen(trim($_POST['subject'])) > 0)) {
        $subject = stripslashes(strip_tags($_POST['subject']));
    } else {$message = 'No subject entered';}

    ob_start();
?>
<html>
    <head>
        <style type="text/css"></style>
    </head>
    <body>
        <table width="550" border="1" cellspacing="2" cellpadding="2">
            <tr bgcolor="#eeffee">
                <td>Name</td>
                <td><?=$name;?></td>
            </tr>
            <tr bgcolor="#eeeeff">
                <td>Email</td>
                <td><?=$email;?></td>
            </tr>
            <tr bgcolor="#eeffee">
                <td>Message</td>
                <td><?=$message;?></td>
            </tr>
        </table>
    </body>
</html>

<?
    $body = ob_get_contents();

    $to = '[email protected]';
    $email = '[email protected]';
    $fromaddress = "[email protected]";
    $fromname = "Online Contact";

    require("phpmailer.php");

    $mail = new PHPMailer();

    $mail->From     = "[email protected]";
    $mail->FromName = "Contact Form";
    $mail->AddAddress("[email protected]","Name 1");

    $mail->WordWrap = 50;
    $mail->IsHTML(true);

    $mail->Subject  =  $subject;
    $mail->Body     =  $body;
    $mail->AltBody  =  "This is the text-only body";

    if(!$mail->Send()) {
        $recipient = '[email protected]';
        $subject = 'Contact form failed';
        $content = $body;    
        mail($recipient, $subject, $content, "From: [email protected]\r\nReply-To: $email\r\nX-Mailer: DT_formmail");
        exit;
    }
?>

你有submitHandler within rules, 它应该是beside它,像这样:

$(function() {
  $("#contact").validate({
      rules: {
          name: {required: true},
          email: {required: true},
          subject: {requred: true}
      },
      submitHandler: function(form) {
          $.ajax({
            type: "POST",
            url: "<?php bloginfo("template_directory"); ?>/contact/process.php",
            data: $(form).serialize(),
            timeout: 3000,
            success: function() {alert('works');},
            error: function() {alert('failed');}
          });
          return false;
      }
  });
});

另请注意添加document.ready处理程序以确保安全。

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

jQuery.validate 插件和 ajax 表单提交 的相关文章

  • 检测浏览器是否支持 contentEditable?

    There s 这个问题 https stackoverflow com questions 3497942 browser detect contenteditable features 但发布的解决方案是浏览器嗅探 我试图避免这种情况
  • 以特定顺序运行具有效果的 jQuery 函数

    我在 javascript 函数中有一些 jQuery 可以更改页面上的文本并以特定的时间间隔淡入和淡出 我希望这些函数在每个函数完成其效果后按顺序运行 dialogueExchange1 dialogueExchange2 dialogu
  • 选择更新后不起作用

    我有一个选择的下拉菜单 我更改了选项内容并调用触发器选择 更新但选择不重建下拉列表 这是我更新的
  • JQuery 颜色盒

    如何在没有事件绑定的情况下在页面加载时显示 Colorbox 更简单地说 我希望 Colorbox 在页面加载时立即加载 这是我目前正在使用的 Colorboxhttp colorpowered com colorbox http colo
  • 使用 jquery ajax 和 asp.net 处理程序上传文件

    我正在努力让它工作 但我在上传文件时遇到错误 ASPX
  • jqgrid inlineNav add - 在添加的行上显示保存图标

    我正在使用 jqgrid 的 inlineNav 选项向工具栏添加 添加 选项 我还使用操作格式化程序进行编辑和删除 当我添加新行时 新添加的行有一个编辑图标和一个取消图标 而保存图标位于添加旁边的工具栏上 有没有办法指定新添加的行具有保存
  • 使用 JSF 2.0 Ajax 响应访问 bean 函数的返回值?

    我正在使用 JSF 2 0 构建一个调度应用程序 用户可以在其中将项目添加到日历中 然后编辑这些对象 我广泛使用 AJAX 来防止页面刷新 我遇到的问题是从使用 AJAX 调用的函数中获取返回值
  • kendo ui:grid - 将页面设置在网格的顶部和底部

    有一种简单的情况无法找到解决方案 Kendo UI 仅在底部实现网格分页 我试图让它在顶部显示寻呼机 但它变得无法点击 我认为我的克隆部分是错误的 但不知道如何修复它 预先感谢各位 这是脚本和jsp的一部分
  • Facebook“赞”按钮回调帮助

    我正在使用此代码进行类似 facebook 的回调 问题是 如果我调用 php 脚本 例如 有人可以看到我的 javascript 并运行此页面 甚至可以向其发送垃圾邮件或在没有先点赞的情况下使用它 我的想法是 我想为每个喜欢该页面的用户提
  • 在跨开口的 Bootstrap 弹出窗口中保留复选框

    我在引导弹出窗口内有复选框 我将其用作表单的一部分 当用户打开弹出窗口 选择一些复选框 关闭弹出窗口 然后重新打开弹出窗口时 我遇到问题 新打开的弹出窗口不会显示用户上次打开弹出窗口时选中的框 我需要用户的选择在弹出窗口启动时保持不变 我猜
  • Ajax ModalPopup 在 IE8 - IE9 中显示错误

    我在我的aspx web VB NET 中使用ModalPopup AJAX 使用母版页 它在 ie6 Firefox 中工作正常 但是当我使用IE7 IE8 IE9时 当我想打开Modalpopup时 显示不正确 屏幕被放大 当我使用鼠标
  • 在 jQuery 中,每次 DOM 更改时如何调用函数?

    我需要确保即使 DOM 更改后页面仍保持脚本描述的方式 我的脚本必须处理 DOM 的这些更改 以便我的脚本不仅仅处理初始状态 是否有一个事件可以用来处理这些 DOM 更改 从最严格的意义上来说 你的问题是这样的 Narrow the con
  • 嵌套列表、jquery 和 stopPropagation

    我遇到了嵌套菜单未按照我预期的方式运行的问题 我已经在 StackOverflow 上查看了一堆有关 stopPropagation 的内容 但它似乎不起作用 不幸的是 该网站是基于 WordPress 的 因此我无法直接控制网站上菜单生成
  • 在 iOS Safari 上滚动后锚点失去点击能力

    使用它来获取点击次数 nav li a click function event event preventDefault target this attr href replace goToByScroll target 这是滚动功能 f
  • 每n秒执行一次函数

    我制作了这个在 10 秒后点击链接的代码片段 function timeout window setTimeout function img left click 1000 setTimeout timeout 1000 timeout 我
  • jquery 中可点击 div 中的按钮

    我有整个 div 您可以单击它来切换该 div 的主要部分 问题是我在该 div 中也有可点击的按钮 当我点击它时 它会执行它应该做的事情 但同时也会切换整个 div 我怎样才能禁用它 Use event stopPropagation 单
  • 在 javascript 中实现固定位置会导致 Safari 滚动时出现抖动

    固定位置不适用于我的用例 因为它固定在浏览器窗口上 您可能会处于文本在屏幕右侧之外且无法到达的状态 无论如何 我尝试使用绝对定位 然后调整javascript中的 顶部 它在 Firefox 和 Chrome 中运行良好 但在 Safari
  • 如何使用 jQuery 从 REST xml 响应构建数据表?

    我有来自 Ajax REST 调用的 XML 响应 与下面的类似
  • PHP Json_encode 将空格更改为加号 +

    我有一个网络应用程序 我首先将 JSON 数据存储在 cookie 中 然后每 x 秒保存到数据库 它只是打开与服务器的连接 服务器读取 cookie 它实际上并不通过 POST 或 GET 发送任何内容 当我保存到 cookie 时 我的
  • 如果 jquery 验证激活,如何在单选按钮中放置红色边框[重复]

    这个问题在这里已经有答案了 我的问题是 如果 jquery 验证像示例图片中那样激活 我无法使单选按钮具有红色边框 任何人都可以帮我解决这个问题吗 http i38 photobucket com albums e149 eloginko

随机推荐

  • 在 Cpanel 上上传 Laravel 项目中的图像

    我的功能是上传图像 但问题是为什么图像没有上传到 public html 文件夹 图像上传到项目的公共文件夹中 private function upload image tbl name image gt getClientOrigina
  • Qt::BackgroundRole 似乎被忽略

    我正在使用源自的自定义表格模型QAbstractTableModel 我已经覆盖了headerData 我可以通过返回颜色来更改单个行标题 或列标题 但我在这里只讨论行 的字体颜色Qt ForegroundRole if role Qt F
  • Java Swing:JScrollPane 不工作

    我有一个包含一些字段的 JPanel JPanel 的高度有限 因此我必须在它周围放置一个 JScrollPane 以便人们可以向下滚动 正如您在下面看到的 它显示得非常完美 但您无法向下 或向上 滚动 DetailPanel detail
  • 如何在 Azure AD 身份验证后重定向到 ASP Net Core MVC 中的不同控制器操作

    我已将 ASP Net Core 2 0 项目设置为使用 Azure AD 进行身份验证 使用 VS2017 中使用 OIDC 的标准 Azure AD 身份验证模板 一切工作正常 应用程序返回到基本 url 并在身份验证成功后运行 Hom
  • 如何让 Hadoop 使用我系统上的所有核心?

    我有一个32核的系统 当我使用 Hadoop 运行 MapReduce 作业时 我从未看到 java 进程使用超过 150 CPU 根据 top 并且通常保持在 100 左右 它应该接近 3200 我需要更改哪些属性 以及在哪个文件中 才能
  • 将自定义 Soap 标头添加到 Web 服务请求

    我已经使用 apache axis2 为 Web 服务生成了存根 并且我想将自定义肥皂头添加到请求中 我希望肥皂头看起来像这样
  • OpsHub 迁移似乎不再正常运行

    大约一个月前 我对一些本地 TFS 项目到在线 Visual Studio 进行了测试迁移 在大多数情况下 一切都有效 变更集已迁移 显示与本地相同的签入用户 并带有显示原始签入日期 用户和变更集 ID 的注释 与工作项相同 我会查看历史记
  • 在 NumPy 或 PyTorch 中从矩阵获取对角线“条纹”

    我需要获得矩阵的对角线 条纹 假设我有一个大小为 KxN K gt N 的矩阵 0 1 2 3 4 5 6 7 8 9 10 11 我需要从中提取一条对角线条纹 在本例中 是通过截断原始矩阵创建的矩阵 MxV 大小 0 x x 3 4 x
  • Kubernetes Ingress - 第二个节点端口没有响应

    我在本地运行 K8S 集群 云中没有 有一个 K8S 主节点和两个工作节点 k8s master 192 168 100 100 工作节点1 192 168 100 101 工作节点2 192 168 100 102 我使用 kuberne
  • 为什么截断 BytesIO 会弄乱它?

    在 OSX 上的 Python 3 5 1 上运行 import io b io BytesIO b write b 222 print b getvalue b truncate 0 b write b 222 print b getva
  • 如何防止在 Objective-C 中使用除我的自定义方法之外的其他 init 方法

    背景 在我的 iPhone 应用程序中 我有一个自定义 UITableViewController 我打算通过将现有的 id initWithStyle UITableViewStyle style 方法扩展为扩展的自定义方法来向其传递一些
  • 具有固定标题和全页宽度网格的 Gridview

    我之前问过问题在 gridview 中冻结标题时正确设置标题宽度和列通过使用这些解决方案 我发现分辨率存在一些问题 因此我在设计本身中添加了所有列 但是当列具有大长度文本时 我仍然面临问题 我正在尝试使用此中给出的代码冻结 Gridview
  • 频域中的 Gabor 滤波器实现

    Here我们有 Gabor 滤波器的空间域实现 但是 我需要在频域中实现 Gabor 滤波器出于性能原因 我已经找到了Gabor滤波器的频域方程 I am actually in doubt about the correctness an
  • 将字符串属性绑定到对象

    假设我有一堂这样的课 public class MyClass public string Name public int Id public override string ToString return this Id ToString
  • 如何使用QTcpSocket监听qt中的特定端口? [复制]

    这个问题在这里已经有答案了 我正在使用 QTcpSocket 在两个应用程序之间进行通信 一个是C 程序 另一个是用PHP编写的网页 目标是使用套接字将数据从我的网页发送到我的 C 程序 我不知道如何在特定端口 例如 12345 上打开连接
  • 为 Git 存储库自定义 CSH 提示

    当我在 Git 存储库中时 我希望有一个自定义 CSH 提示 如果我不在 git 存储库中 我希望提示符看起来像这样 host name gt 但是当我进入 Git 存储库时必须变成这样 host name GIT REPO ROOT DI
  • 禁用 Jackson 中的数字到字符串自动转换

    当我向 Spring Boot 后端发出 json 请求时 Jackson 会自动将数字转换为字符串 有办法防止这种情况吗 例如 JSON numberAsString 123 JAVA private String numberAsStr
  • scala 应用程序中找不到对象播放

    我正在使用Eclipse并创建一个新的Scala对象 想要使用play的json解析功能并导入此包 但出现错误object play无法找到 想知道如何在 Scala 对象中使用 play 库 这就是我导入的方式 import play a
  • 无法在node.js中使用mongoose查询mongoDB

    假设我的 mongoDB 中有一个集合 db co并且只有一个文档 id ObjectId 50d083e32cdcf7ce065b616c age 22 friends Tom location NY name lee skill jav
  • jQuery.validate 插件和 ajax 表单提交

    我一生都无法让它发挥作用 验证错误看起来很好 我没有收到语法错误 但什么也没有发生 表单只是提交到页面 我也无法获得成功或错误警报