2012-10-25 70 views
0

我试图在iframe中调用colorbox(覆盖整个页面)来创建联系表单。除了表单不会提交,我在验证后丢失了css样式和所有内容之外,我几乎可以找到所有的东西。我做错了什么?对你的帮助表示感谢。谢谢!!!iframe colorbox contact form will not submit and styles will not stay after validation

这里是我的代码至今:

contactform.html

<body> 

    <form name="form1" method="post" action="sendmessages.php">  
      <input type="text" name="your_name" class="your-name" id="your-name" placeholder="your name">   
      <input type="text" name="email-address" class="email-address" id="email-address" placeholder="email address"> 
      <textarea name="comments" class="comments" id="comments" placeholder="type your message here..."></textarea> 
      <input type="submit" value="submit" name="submit" class="submit"> 
    </form> 

颜色框-k.css

#colorbox, #cboxOverlay, #cboxWrapper{ 
    position:absolute; 
    top:0; 
    left:0; 
    z-index:9999; 
    overflow:hidden; 
    } 
#cboxOverlay{ 
    position:fixed; 
    width:100%; 
    height:100%; 
    } 
#cboxContent{ 
    position: relative; 
    overflow:hidden; 
    } 
#cboxLoadedContent{ 
    overflow:hidden; 
    } 
#cboxLoadedContent iframe{ 
    display:block; 
    position:absolute; 
    width:100%; 
    height:100%; 
    border:0; 
    } 

#cboxOverlay{background:url(../images/overlay.png) repeat 0 0;} 
#colorbox{} 
#cboxContent{ 
    position:fixed; 
    width:536; 
    height:409; 
    } 
#cboxClose{ 
    display:block; 
    position:absolute; 
    top:0px; 
    left:0px; 
    background:url(../images/close.png) no-repeat 0 0; 
    width:31px; 
    height:31px; 
    padding: 0px; 
    border: 0px; 
    text-indent:-9999px; 
    } 
body { 
    background: url(../images/envelope.png) center no-repeat; 
    display: block; 
    position: absolute; 
    width: 536px; 
    height: 409px; 
    z-index:12; 
    position: relative; 
    margin:auto; 
} 

input[type=text] { 
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; 
    font-size: 10px; 
    background-color:rgb(255,255,255); 
    color: #787474; 
    padding-left: 10px; 
    width:194px; 
    height:24px; 
    position: absolute; 
    border-color: #000000; 
    border-width:2px; 
    border-style:solid; 
    } 

.comments { 
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; 
    font-size: 10px; 
    background-color:rgb(255,255,255); 
    color: #787474; 
    padding: 10px 0 0 10px; 
    width:414px; 
    height:140px; 
    border-color: #000000; 
    border-width:2px; 
    border-style:solid; 
    position: absolute; 
    top: 150px; 
    left: 54px; 
} 

.your-name { 
    position: absolute; 
    top: 104px; 
    left: 54px; 
} 

.email-address { 
    position: absolute; 
    top: 104px; 
    left: 272px; 
} 

.submit { 
    width: 70px; 
    height: 24px; 
    background: url(../images/send-btn.png) center no-repeat; 
    position: absolute; 
    top: 338px; 
    right: 54px; 
    padding: 0px; 
    border: 0px; 
    text-indent:-9999px; 
} 

.submit:hover{ 
    background: url(../images/send-btnr.png); 
} 

.submit:active{ 
    background: url(../images/send-btn.png); 
} 

sendmessages.php

<?php 

    // Comments 
    $message="$comments"; 

    // Mail of sender 
    $mail_from="$email-address"; 

    // From 
    $header="from: $your-name <$mail_from>"; 

    // Enter your email address 
    $to ='[email protected]'; 
    $send_contact=mail($to,$subject,$message,$header); 

    // Check, if message sent to your email 
    // display message "Thank you!" 
// Check, if message sent to your email 
// display message "Thank you!" 
if($send_contact){ 
echo "<p style='background: url(../images/envelope_sent.png)   center no-repeat; 
    display:block; 
    position:relative; 
    top: -6px; 
    left: -6px; 
    width:536px; 
    height:409px; 
    z-index:12; 
    margin:auto; 
    padding:0px;'></p>"; 
} 
else { 
echo "ERROR"; 
} 
    ?> 

SYNTAX ERROR

$email-address=$_POST['email-address']; 
$your-name=$_POST['your_name']; 
$header. = 'Content-type: text/html; charset=iso-8859-1' . "\n";  

$header.="From: " . $your-name <$email-address>."\n"; 
+0

你没有复制粘贴完整的代码,请参阅$ header。= ...到你的代码和$ header = .....到我的代码中,不同的点“。”。 – pkachhia

回答

0

你必须让你不得不开始使用$ _ POST变量这样的数据,使用下面sendmessages.php页面代码 您使用Post方法:

UPDATE

$comments=$_POST['comments']; 
$email_address=$_POST['email-address']; 
$your_name=$_POST['your_name']; 

//echo "comments:".$comments."<br>"; 
//echo "email:".$email_address."<br>"; 
//echo "name:".$your_name."<br>"; 
//exit(); 


// Comments 
$message=$comments; 


$header='MIME-Version: 1.0'."\n"; 

$header.='Content-type: text/html; charset=iso-8859-1'."\n";  

$header.="From: " . $your_name."<".$email_address.">"."\n"; 
$subject="Mail test"; 
// Enter your email address 
$to ='[email protected]'; 
$send_contact=mail($to,$subject,$message,$header); 
+0

@monbee我认为你必须为“谢谢”页面的不同背景添加HTML和CSS。对于提交按钮,你只需要更新你的CSS类。我已经在这里用Chrome上的检查元素进行了测试,你可以试试你的身边。如果没有得到它,那么回到这里,我会给你一个提示。 – pkachhia

+0

我设法让“谢谢”消息加载更新的背景(请参阅更新的.php)。我也在Chrome上进行了测试,出于某种原因显示“提交”按钮...我现在遇到另一个问题,因为在IE以及iphone/ipad中,colorbox行为不正常。我应该将这个问题作为一个新问题发布,因为我的原始问题已经得到解答(thx了!)? – monbee

+0

是的,问一个新问题 – pkachhia