Phonegap联系表:如何使用phonegap在html中发送联系表单消息

时间:2015-06-09 12:30:18

标签: javascript php html cordova phonegap-build

我有一个HTML页面并在phonegap中转换它有一个contact.html的联系表格我有名称mail-id和comments.And我希望所有三个字段都邮寄到我的邮件ID。如何实现这一点。

我的Php页面位于http://www.kishorebt.net84.net/contact-form-handler.php等免费网站托管网站中,所以每当我点击发送,我都会在浏览器中获取php代码。

我的页面没有在服务器上运行,所以如何实现这一点。

我的HTML页面

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html>
<head>

<script language="JavaScript" src="scripts/gen_validatorv31.js" type="text/javascript"></script>
</head> 
</head>

<body>
<h1>Contact us</h1>
<form method="POST" name="contactform" action="http://www.kishorebt.net84.net/contact-form-handler.php"> 
<p>
<label for='name'>Your Name:</label> <br>
<input type="text" name="name">
</p>
<p>
<label for='email'>Email Address:</label> <br>
<input type="text" name="email"> <br>
</p>
<p>
<label for='message'>Message:</label> <br>
<textarea name="message"></textarea>
</p>
<input type="submit" value="Submit"><br>
</form>

<script language="JavaScript">

var frmvalidator  = new Validator("contactform");
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>

和我的php页面

<?php 
$errors = '';
$myemail = 'kishorebt11@gmail.com';//<-----Put Your email address here.
if(empty($_POST['name'])  || 
   empty($_POST['email']) || 
   empty($_POST['message']))
{
    $errors .= "\n Error: all fields are required";
}

$name = $_POST['name']; 
$email_address = $_POST['email']; 
$message = $_POST['message']; 

if (!preg_match(
"/^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,3})$/i", 
$email_address))
{
    $errors .= "\n Error: Invalid email address";
}

if( empty($errors))
{
    $to = $myemail; 
    $email_subject = "Contact form submission: $name";
    $email_body = "You have received a new message. ".
    " Here are the details:\n Name: $name \n Email: $email_address \n Message \n $message"; 

    $headers = "From: $myemail\n"; 
    $headers .= "Reply-To: $email_address";

    mail($to,$email_subject,$email_body,$headers);
    //redirect to the 'thank you' page
    header('Location: contact-form-thank-you.html');
} 
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html>
<head>
    <title>Contact form handler</title>
</head>

<body>
<!-- This page is displayed only if there is some error -->
<?php
echo nl2br($errors);
?>


</body>
</html>

1 个答案:

答案 0 :(得分:0)

@kishore, 这是一个很好的例子CGI变成一个应用程序。首先将HTML4转换为HTML5。您可以使用my generic boilerplate开始使用。需要注意三(3)个大的差异。

html5的新开放元素是:

<!DOCTYPE html>

下一个最重要的元素是

<meta name="viewport" content="width=device-width">

第三是听众。许多初学者都在这一部分旅行。添加此侦听器非常重要。它允许phonegap库在您调用任何库之前准备手机上的所有设备。

// Wait for PhoneGap to load
document.addEventListener("deviceready", onDeviceReady, false);
//
function onDeviceReady() {

但是,如果您不打算使用这些设备,则至少应该有<body onload=loaded()>

我怀疑你有更多问题。如果是这样,还有另外两个论坛可以提问。