Question

我一直试图解决这个问题，我想这只是超过了我的经验水平。

我有一个使用基础构建的联系表单，通过有效提交（通过基金会处理）发布到mail.php，我希望它在成功提交表单时打开一个显示模式。

<script>
 $('#contact-form') 
.on('valid', function () {

    var fname = $("input#first-name-input").val();
    var lname = $("input#last-name-input").val();
    var email = $("input#email-input").val();
    var message = $("textarea#message-input").val();

        //Data for response
    var dataString = 'fname=' + fname +
        '&lname=' + lname +
        '&email=' + email +
        '&message=' + message;

    //Begin Ajax call
    $.ajax({
        type: "POST",
        url: "mail.php",
        data: dataString,
        success: function() {
            $('#contact-modal').foundation('reveal', 'open');
    }

}); //ajax call
return false;
});
</script>

如果重要，我的mail.php文件如下所示：

<?php

$fname = $_POST["fname"];
$lname = $_POST["lname"];
$email = $_POST["email"];
$message = $_POST["message"];

$msg = "

Name: $fname
Last $lname
Email: $email
Comments:
$message

";

$to = "myemail@email.com";
$subject = "mysite.com Contact";
$message = $msg;
$headers = "My site contact form";
mail($to,$subject,$message,$headers);

?>

任何其他与半相关的提示也将受到赞赏。

Answer 1

首先，不要忘记在模态存在的文档中加载基础本身：

<script>
    $(document).foundation();
</script>

其次，如果您通过ajax显示模态，则需要设置 data-reveal-ajax =“true”：

<a href="http://some-url" data-reveal-id="myModal" data-reveal-ajax="true">

最后，

$('#myModal').foundation('reveal', 'open', 'mail.php');

显示成功提交表格时不启动模态

1 个答案: