HTML表单上的提交不会将数据提交到相关页面

问题描述 投票:0回答:2

我正在尝试向网站添加模板联系表单,但无法提交自定义html表单。提交时,会显示“提交的联系表单”消息,但未收到任何电子邮件。传递数据的页面如果独立运行,但不是从表单,任何想法?

<form id="form" method="post" action="contactengine.php">
<div class="success_wrapper">
    <div class="success-message">Contact form submitted</div>
    </div>
        <label class="name">
            <input type="text" name="Name" id="Name" placeholder="Name:" data-constraints="@Required @JustLetters" />
            <span class="empty-message">*This field is required.</span>
            <span class="error-message">*This is not a valid name.</span>
        </label>
        <label class="email">
            <input type="text" name="Email" id="Email" placeholder="E-mail:" data-constraints="@Required @Email" />
            <span class="empty-message">*This field is required.</span>
            <span class="error-message">*This is not a valid email.</span>
        </label>
        <label class="phone">
            <input type="text" name="Contact" id="Contact" placeholder="Phone:" data-constraints="@Required @JustNumbers"/>
        <span class="empty-message">*This field is required.</span>
        <span class="error-message">*This is not a valid phone.</span>
        </label>
        <label class="message">
            <textarea name="Message" id="Message" placeholder="Message:" data-constraints='@Required @Length(min=20,max=999999)'></textarea>
        <span class="empty-message">*This field is required.</span>
        <span class="error-message">*The message is too short.</span>
        </label>
    <div>
    <div class="clear"></div>
    <div class="btns">
        <a href="#" data-type="reset" class="btn">Clear</a>
        <a href="#" data-type="submit" class="btn">Submit</a>                                   
    </div>
    </div>
</form> 

看不到用于提交表单数据并怀疑这可能是问题? “清除”按钮按预期工作。

我已经设置了一个如下所示的简单表单,它完全符合我的预期,但公司希望表单与其他站点相匹配,因此尝试这样做:

<form  action="contactengine.php" method="POST" enctype="multipart/form-data">
<input type="hidden" name="action" value="submit">
Your name:<br>
<input name="name" type="text" value="" size="30"/><br>
Your email:<br>
<input name="email" type="text" value="" size="30"/><br>
Your message:<br>
<textarea name="message" rows="7" cols="30"></textarea><br>
<input type="submit" value="Send email"/>
</form>

以下是发送邮件的代码:

<?php

$EmailFrom = Trim(stripslashes($_POST['Email']));
$EmailTo = "[email protected]";
$Subject = "Test Contact Form";
$Name = Trim(stripslashes($_POST['Name'])); 
$Tel = Trim(stripslashes($_POST['Contact'])); 
$Email = Trim(stripslashes($_POST['Email'])); 
$Message = Trim(stripslashes($_POST['Message'])); 

$Body  = 'MIME-Version: 1.0' . "\r\n";
$Body .= 'Content-type: text/html; charset=utf-8' . "\r\n";
$Body .= 'From: '. $EmailFrom . "\r\n" . 'X-Mailer: PHP/' . phpversion();
$Body = "";
$Body .= "Name: ";
$Body .= $Name;
$Body .= "\n";
$Body .= "Tel: ";
$Body .= $Tel;
$Body .= "\n";
$Body .= "Email: ";
$Body .= $Email;
$Body .= "\n";
$Body .= "Message: ";
$Body .= $Message;
$Body .= "\n";

$from = "$Email <>";
$headers  = "From: $from\r\n"; 

// send email 
mail($EmailTo, $Subject, $Body, $headers);

?>
html forms submit href
2个回答
0
投票

您确定表单是否正确提交?你有$ _POST的数据吗?


0
投票

目前,html中没有任何内容可以提交表单。检查这个codepen有一种方法:https://codepen.io/jonolayton/pen/mGMJeX

function submitted() {
  
  alert("The form has been submitted!");
  
}
<form id="form" method="post" action="contactengine.php">
<div class="success_wrapper">
    <div class="success-message">Contact form submitted</div>
    </div>
        <label class="name">
            <input type="text" name="Name" id="Name" placeholder="Name:" data-constraints="@Required @JustLetters" />
            <span class="empty-message">*This field is required.</span>
            <span class="error-message">*This is not a valid name.</span>
        </label>
        <label class="email">
            <input type="text" name="Email" id="Email" placeholder="E-mail:" data-constraints="@Required @Email" />
            <span class="empty-message">*This field is required.</span>
            <span class="error-message">*This is not a valid email.</span>
        </label>
        <label class="phone">
            <input type="text" name="Contact" id="Contact" placeholder="Phone:" data-constraints="@Required @JustNumbers"/>
        <span class="empty-message">*This field is required.</span>
        <span class="error-message">*This is not a valid phone.</span>
        </label>
        <label class="message">
            <textarea name="Message" id="Message" placeholder="Message:" data-constraints='@Required @Length(min=20,max=999999)'></textarea>
        <span class="empty-message">*This field is required.</span>
        <span class="error-message">*The message is too short.</span>
        </label>
    <div>
    <div class="clear"></div>
    <div class="btns">
        <a href="#" data-type="reset" class="btn">Clear</a>
        <a href="#" data-type="submit" class="btn">Submit</a>                      
    </div>
    </div>
  <input type="submit" onclick="submitted()">
</form>

目前,您(我认为)尝试在链接中使用data属性:

<a href="#" data-type="submit" class="btn">Submit</a>

提交表格。但是数据属性不会自己提交表单,没有一些代码(通常是javascript)来处理它。您可以在此处阅读有关数据属性的更多信息:https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes

你需要添加一些html,或者一些javascript(或两者),它们实际上会在点击时提交表单。

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