表单提交多个收件人，PHP和ajax/jquery

form submission multiple recipients, php and ajax/jquery

本文关键字：ajax jquery PHP 收件人 表单提交      更新时间：2023-09-26

我已经搜索并发现了一些与我的问题相关的问题，但没有类似的东西。我确实尝试过在同一页面上显示提交的表单响应。(没有重新加载)，但它没有工作。
问题是，我试图从wordpress页面提交表单，表单不是唯一的元素在它。无论如何，我可以使用action=myemail.php获得基本表单，php脚本在服务器上，但它将我带到一个不同的页面，在那里它返回"谢谢您提交等"。我尝试了目标属性中的iframe，它可以让我留在同一个页面上，但没有显示成功消息。
我需要做两件事，一个是留在同一个页面上，只是在同一个页面上回应一个成功的消息(不是一个警告弹出框)。其次，可以根据表单中的一个下拉菜单选择不同的电子邮件地址，下拉菜单中有3个选项，每个都有一个单独的电子邮件地址。目前，它只发送到send_to地址。
这是我的表单的html里面的<section>标签，在wordpress页面:

&nbsp;
<section class="iframe form">
<div class="content">
<h3 class="section-header">Request Some Info</h3>
<div class="row">
<div class="col-sm-2 col-xs-offset-1">
<form name="myform" method="post" action="/myemail.php" target="my_iframe">
<div class="form-group"><input class="form-control" name="email" type="email" placeholder="Email Address" /></div>
</div>
<div class="col-sm-4">
<div class="form-group"><input class="form-control" name="myquestion" type="text" placeholder="Some question?" /></div>
</div>
<div class="col-sm-2">
<div class="form-group"><select class="form-control" name="sendto">
<option value="admission">To Person1</option>
<option value="hr">To Person2</option>
<option value="general">Person3</option>
</select></div>
</div>
<div class="col-sm-2">
<div class="form-group"><input class="btn btn-warning btn-block" type="submit" value="Request Info"></div>
</div>
</form>
</section>&nbsp;
<iframe name="my_iframe" width="1" height="1" style="border:none"></iframe>

为长问题道歉，但我希望我已经提供了所需的信息。几乎是编程新手，做过非常基本的shell脚本，但不多。抱歉，如果我问的东西对程序员来说应该是显而易见的。在阅读和研究之后，我的理解是我需要使用ajax/jquery，我真的不知道，但我可能是错的，可能有另一种方式。

很难发布这样的代码，所以您必须将此代码复制并粘贴到您的设置中。

HTML

形式

<form id="my_form_element">
    <input type="text" name="your_name">
    <select name="email_to">
        <option>your@email.com</option>
        <option>email@two.com</option>
    </select>
    <button type="submit">Submit</button>
</form>

JavaScript，它将表单数据发送到PHP

$('#my_form_element').on('submit',function(e){
    e.preventDefault();
    // this is where you'd potentially do some validation to check the fields are filled
    // convert the form into a js array of key => value pairs
    var formData = $(this).serializeArray();
    // set up the vars for posting
    formData = $.param( formData );
    $.ajax({
        type: "POST",
        url: window.location.host+"/wp-admin/admin-ajax.php",
        data: "action=formpostfunction&"+formData,
        cache: true,
        success: function(results){
            // do stuff once the form is sent successfully
            // this is the AJAX success callback
            alert(results);
            // adding a success message to the page, example
            $('#my_form_element').append('<p>Sent successfully!</p>');
        }
    });
});

进入functions。php

add_action('wp_ajax_formpostfunction', 'formpost');
add_action('wp_ajax_nopriv_formpostfunction', 'formpost');
function formpost(){
    // here we can access the form key => value pairs, i.e.
    // anything echoed here will be returned to the AJAX success callback
    echo $_POST['your_name'];
    echo $_POST['email_to'];
    // this is where you can do your mail sending
    // this stops a trailing 0 that gets returned with WP admin-ajax requests
    if(!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') { die(); }
}
相关文章：