简体   繁体   中英

HTML form working on web browser but not on mobile devices

I'm a non-coder or a very new one. I adapted an existing HTML form to work in an email template. There is one field (user email address) and the submit button. When user clicks submit, a php script sends me an email with the data submitted. The thing works fine on Gmail & Outlook on the desktop, but it doesn't work when I am opening the email and clicking on the submit button on a mobile app (eg Inbox by gmail, outlook, or spark). The error I get (after being redirected to the mobile browser) is: "You need to submit the form" and a validation error (ie that no data was inputted). And while I do receive an email saying that the form is submitted, no data is receieved (even though I have inputted data for sure). Please help!

<?php
if(!isset($_POST['submit']))
{
    //This page should not be accessed directly. Need to submit the form.
    echo "error; you need to submit the form!";
}
$email = $_POST['email'];

//Validate first
if(empty($email)) 
{
    echo "we need your email address for this to work!";
    exit;
}

if(IsInjected($email))
{
    echo "Bad email value!";
    exit;
}

$email_from = 'hello@melltoo.me';//<== update the email address
$email_subject = "New Pay&Ship Beta User from Existing Users";
$email_body = "The user $email.\n is responding positively to your email".
    "He/she wants to be a part of beta testing for Pay&Ship ".

$to = "hello@melltoo.me";//<== update the email address
$headers = "From: $email_from \r\n";
$headers .= "Reply-To: $email \r\n";
//Send the email!
mail($to,$email_subject,$email_body,$headers);
//done. redirect to thank-you page.
header('Location: thank-you.html');


// Function to validate against any email injection attempts
function IsInjected($str)
{
  $injections = array('(\n+)',
              '(\r+)',
              '(\t+)',
              '(%0A+)',
              '(%0D+)',
              '(%08+)',
              '(%09+)'
              );
  $inject = join('|', $injections);
  $inject = "/$inject/i";
  if(preg_match($inject,$str))
    {
    return true;
  }
  else
    {
    return false;
  }
}

?> 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html>
<head>
    <title>PHP form to email sample form</title>
<!-- define some style elements-->
<style>
label,a 
{
    font-family : Arial, Helvetica, sans-serif;
    font-size : 12px; 
}
/*FORM STYLES*/ 
.tagline-form-object{margin-top:20px;text-align:center}.footer-form-input,
.tagline-form-input{background-color:#FFF;font-size:20px;padding:10px 15px;font-weight:700;color:#555459;border-radius:4px;width:300px;margin-right:10px}
.tagline-form-submit{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-color:#0cb37b;font-size:20px;padding:10px 30px;border-radius:4px;font-weight:700;color:#FFF;text-shadow:0 1px 2px rgba(0,0,0,.5);cursor:pointer}
.tagline-form-submit:hover{background-color:#3DA7F2}
.tagline-form-submit:active{border-bottom:1px solid #194BA3;margin-top:1px}

</style>    
<!-- a helper script for vaidating the form-->
<script language="JavaScript" src="scripts/gen_validatorv31.js" type="text/javascript"></script>
</head>


<body>

<!-- Start code for the form-->
<form method="post" name="myemailform" action="form-to-email.php">
            <p>
        <input type="text" class="tagline-form-input" name="email" value="user-email@email.com">
    </p>
    <input class="tagline-form-submit" type="submit" name='submit' value="Add 25 AED to my account!">
</form>
<script language="JavaScript">
// Code for validating the form
// Visit http://www.javascript-coder.com/html-form/javascript-form-validation.phtml
// for details
var frmvalidator  = new Validator("myemailform");
frmvalidator.addValidation("name","req","Please provide your name"); 
frmvalidator.addValidation("email","req","Please provide your email"); 
frmvalidator.addValidation("email","email","Please enter a valid email address"); 
</script>
    </body>
</html>

Forms in an HTML email have been a risky venture for a long time and still continue today. It places a security risk that some email clients flat out block interactivity with it (eg Outlook) and most others have some sort of warning or limited capability filter on them. ( Campaign Monitor )

There is also speculation (but no real solid facts) that HTML forms can reduce deliverability to some ISPs.

It is recommended to send the recipient to a landing page to fill in and submit a form there via their web browser where the security risk is greatly reduced and so are the restrictions and weird behavior that email servers can present.

Also - Why are you submitting a form to collect an email address, when you obviously already have the email address if you are sending them an email. Rather than do a form submit, do a POST or a GET on a landing page with the email address in the parameter of the URL to process your needs. It will remove all user interaction outside a click.

How to pull parameters from URL using Javascript

How to submit a form using Javascript

What the if (!isset($_POST['submit'])) does, is basically check if the button was clicked. On a mobile browser; I suspect people will enter their data into the field; and then use the Go button on their keyboard to submit it.

This means the form will get posted, but not by pressing the button. If you replace the first line with if ($_SERVER['REQUEST_METHOD'] != 'POST') , this should at least fix the first error.

For the second error, could you show what var_dump($_POST); outputs after submitting the form?

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM