高级表单提交-单选、复选框和重定向


Advanced Form Submission -Radios, Checkboxes, and redirects

我有一个高级表单,可以根据用户对单选框和复选框的选择来切换div。我需要获取这些数据,并在提交表单时通过电子邮件提交。下面是到目前为止我使用的HTML和PHP。根据我所做的测试,它不会发送电子邮件,也不会重定向,所以我甚至不确定它是否捕获了我迄今为止记录的数据。

<form accept-charset="UTF-8" action="survey.php" class="" id="new_signup_context" method="post" data-abide>
            <div class='choose_level tile'> 
                <div class='row'>
                    <div class='large-12 columns'>
                        <h2>What are you looking for?</h2>
                    </div>
                </div>
                <div class='row'>
                    <div class='large-6 columns opt1a'>
                        <label class='select' data-level='custom' for='level_custom'>
                        <img data-level='custom' src='img/51.png'>
                        </label>
                        <h3>Custom</h3>
                        <input id='level_custom' name='level1' type='radio' value='custom'>
                        <label class='button blue_button select' data-level='custom' for='level_custom'></label>
                    </div>
                    <div class='large-6 columns opt1b'>
                        <label class='select' data-level='townhome' for='level_townhome'>
                        <img data-level='townhome' src='img/aspen.png'>
                        </label>
                        <h3>Townhome</h3>
                        <input id='level_townhome' name='level1' type='radio' value='townhome'>
                        <label class='button blue_button select' data-level='townhome' for='level_townhome'></label>
                    </div>
                </div>
            </div>
        <!-- Custom Tier 1 -->
        <div class='choose_style tile centered hidden' data-behavior='SignUpDesigns'>
            <div class='row'>
                <div class='large-12 columns'>
                    <h2>Pick the style(s) of home you like.</h2>
                    <div class='store_errors errors'></div>
                </div>
            </div>
            <div class='row homes'>
                <div class='hometype large-3 columns'>
                    <div class='checked'></div>
                    <label for='prairie'>
                        <img src='img/prairie.png'>
                    </label>
                    <input id='prairie' name='hometypes' type='checkbox' value='Prairie'>                   
                </div>
                <div class='hometype large-3 columns'>
                    <div class='checked'></div>
                    <label for='traditional'>
                        <img src='img/traditional.png'>
                    </label>
                    <input id='traditional' name='hometypes' type='checkbox' value='Traditional'>
                </div>
                <div class='hometype large-3 columns'>
                    <div class='checked'></div>
                    <label for='transitional'>
                    <img src='img/transitional.png'>
                    </label>
                    <input id='transitional' name='hometypes' type='checkbox' value='Transitional'>
                </div>
                <div class='hometype large-3 columns'>
                    <div class='checked'></div>
                    <label for='bungalow'>
                        <img src='img/bungalow.png'>
                    </label>
                    <input id='bungalow' name='hometypes' type='checkbox' value="Bungalow">
                </div>
            </div>
            <div class='fixed_button homes hidden centered'>
                <button type="button" class="btn btn-inverse homes">Continue &rarr;</button>
            </div>
        </div>
        <!-- Endof Custom Tier 1 -->
        <!-- Townhome Tier 1 -->
        <div class='choose_layout tile centered hidden' data-behavior='LayoutStyle'>
            <div class='row'>
                <div class='large-12 columns'>
                    <h2>Pick the layout you like best.</h2>
                </div>
            </div>
            <div class='row'>
                <div class='large-6 columns'>
                    <label class='select' data-level='levelb' for='level_b'>
                        <img data-level='levelb' src='img/floorB.jpg'>
                    </label>
                    <h3>Level B</h3>
                    <input id='level_b' name='signup_context[layout_level]' type='radio' value='Level B'>
                    <label class='button blue_button select' data-level='levelb' for='level_b'></label>
                </div>
                <div class='large-6 columns'>
                    <label class='select' data-level='levelc' for='level_c'>
                        <img data-level='levelc' src='img/floorC.jpg'>
                    </label>
                    <h3>Level C</h3>
                    <input id='level_c' name='signup_context[layout_level]' type='radio' value='Level C'>
                    <label class='button blue_button select' data-level='levelc' for='level_c'></label>
                </div>
            </div>
        </div>
        <!-- Endof Townhome Tier 1 -->
        <!-- Custom Tier 2 -->
        <div class='choose_town tile centered hidden' data-behavior='SignUpTowns'>
            <div class='row'>
                <div class='large-12 columns'>
                    <h2>Pick the town(s) you are interested in.</h2>
                    <div class='store_errors errors'></div>
                </div>
            </div>
            <div class='row towns'>
                <div class='preftown large-2 columns'>
                    <div class='checked'></div>
                    <label for='deerfield'>
                        <img src='img/deerield.png' >
                    </label>
                    <input id='deerfield' name='town' type='checkbox' value='Deerfield'>
                </div>
                <div class='preftown large-2 columns'>
                    <div class='checked'></div>
                    <label for='highland_park'>
                        <img src='img/highlandpark.png'>
                    </label>
                    <input id='highland_park' name='town' type='checkbox' value='Highland Park'>
                </div>

                <div class='preftown large-2 columns'>
                    <div class='checked'></div>
                    <label for='northbrook'>
                        <img src='img/northbrook.png'>
                    </label>
                    <input id='northbrook' name='town' type='checkbox' value='Northbrook'>
                </div>
                <div class='preftown large-2 columns'>
                    <div class='checked'></div>
                    <label for='glenview'>
                        <img src='img/glenview.png'>
                    </label>
                    <input id='glenview' name='town' type='checkbox' value="Glenview">
                </div>
                <div class='preftown large-2 columns'>
                    <div class='checked'></div>
                    <label for='wilmette'>
                        <img src='img/wilmette.png'>
                    </label>
                    <input id='wilmette' name='town' type='checkbox' value='Wilmette'>
                </div>
                <div class='preftown large-2 columns'>
                    <div class='checked'></div>
                    <label for='other'>
                        <img src='img/other.png'>
                    </label>
                    <input id='other' name='town' type='checkbox' value='Other'>
                </div>
            </div>
            <div class='fixed_button tbutton hidden'>
                <button type="button" class="btn btn-inverse continue_towns">Continue &rarr;</button>
            </div>
        </div>
        <!-- Endof Custom Tier 2 -->
        <!-- Custom Tier 3 -->
        <div class='choose_land tile centered hidden' data-behavior='Land'>
            <div class='row'>
                <div class='large-12 columns'>
                    <h2>Do you Own or Need land?</h2>
                </div>
            </div>
            <div class='row'>
                <div class='large-6 columns'>
                    <label class='select' data-level='own' for='level_own'>
                        <img data-level='own' src='img/own.png'>
                    </label>
                    <input id='level_own' name='signup_context[layout_level]' type='radio' value='own'>
                    <label class='button blue_button select' data-level='own' for='level_own'></label>
                </div>
                <div class='large-6 columns'>
                    <label class='select' data-level='need' for='level_need'>
                        <img data-level='need' src='img/need.png'>
                    </label>
                    <input id='level_need' name='signup_context[layout_level]' type='radio' value='need'>
                    <label class='button blue_button select' data-level='need' for='level_need'></label>
                </div>
            </div>
        </div>
        <!-- Endof Custom Tier 3 -->
        <!-- Custom Tier 4 -->
        <div class='timeframe tile centered hidden' data-behavior='SignUpYourTimeframe'>
            <div class='row'>
                <div class='large-12 columns'>
                    <h2>What is your timeframe?</h2>
                </div>
            </div>
            <div class='row sizes'>
                <div class='timeframes'>
                    <div class="input select required"><label class="select required" for="signup_context_height"><abbr title="required">*</abbr> Timeframe</label>
                        <select class="select required timeframe_dropdown" id="signup_timeframe" name="timeframe">
                            <option value="now">0-3 months</option>
                            <option value="soon">3-6 months</option>
                            <option value="later">6-9 months</option>
                            <option value="someday">9-12 months</option>
                            <option value="Other">Other</option>
                        </select>
                    </div>
                </div>
                <div class='large-2 columns last'></div>
            </div>
            <div class='fixed_button timeframeb'>
                <button type="button" class="btn btn-inverse continue_timeframe">Continue &rarr;</button>
            </div>
        </div>
        <!-- Endof Custom Tier 4 -->
        <!-- Townhome Tier 2 -->
        <div class='timeframeB tile centered hidden' data-behavior='SignUpYourTimeframeB'>
            <div class='row'>
                <div class='large-12 columns'>
                    <h2>What is your timeframe?</h2>
                </div>
            </div>
            <div class='row sizes'>
                <div class='timeframes'>
                    <div class="input select required"><label class="select required" for="signup_context_height"><abbr title="required">*</abbr> Timeframe</label>
                        <select class="select required timeframeB_dropdown" id="signup_timeframe" name="timeframeB">
                            <option value="now">0-3 months</option>
                            <option value="soon">3-6 months</option>
                            <option value="later">6-9 months</option>
                            <option value="someday">9-12 months</option>
                            <option value="Other">Other</option>
                        </select>
                    </div>
                </div>
            </div>
            <div class='fixed_button timeframebB'>
                <button type="button" class="btn btn-inverse continue_timeframe">Continue &rarr;</button>
            </div>
        </div>
        <!-- Endof Townhome Tier 2 -->
        <!-- Custom Tier 5 -->
        <div class='homesize tile centered hidden' data-behavior='SignUpYourSize'>
            <div class='row'>
                <div class='large-12 columns'>
                    <h2>What size home do you want?</h2>
                </div>
            </div>
            <div class='row sizes'>
                <div class='size'>
                    <div class="input select required"><label class="select required" for="signup_context_size"><abbr title="required">*</abbr> Size</label>
                        <select class="select required custom_dropdown" id="Select1" name="size">
                            <option value="2500">2500 sq.ft</option>
                            <option value="2800">2800 sq.ft</option>
                            <option value="3000">3000 sq.ft</option>
                            <option value="3200">3200 sq.ft</option>
                            <option value="3500">3500 sq.ft</option>
                            <option value="4000+">4000+ sq.ft</option>
                        </select>
                    </div>
                </div>
            </div>
            <div class='fixed_button sizeb'>
                <button type="button" class="btn btn-inverse continue_size">Continue &rarr;</button>
            </div>
        </div>
        <!-- Endof Custom Tier 5 -->
        <!-- Custom Tier 6 -->
        <div class='homeprice tile centered hidden' data-behavior='SignUpYourSize'>
            <div class='row'>
                <div class='large-12 columns'>
                    <h2>What is your budget?</h2>
                </div>
            </div>
            <div class='row prices'>

                <div class='price'>
                    <div class="input select required"><label class="select required" for="signup_context_size"><abbr title="required">*</abbr> Price</label>
                        <select class="select required custom_dropdown" id="Select2" name="price">
                            <option value="850">$850,000</option>
                            <option value="900">$900,000</option>
                            <option value="950">$950,000</option>
                            <option value="1M">$1M</option>
                            <option value="1.1">$1.1M</option>
                            <option value="1.2+">$1.2M+</option>
                        </select>
                    </div>
                </div>
            </div>
            <div class='fixed_button pricesb centered'>
                <button type="button" class="btn btn-inverse continue_price">Continue &rarr;</button>
            </div>
        </div>
        <!-- Endof Custom Tier 6 -->
        <!-- Townhome Tier 3 -->
        <div class='priceB tile centered hidden' data-behavior='your_priceB'>
            <div class='row'>
                <div class='large-12 columns'>
                    <h2>What is your budget?</h2>
                </div>
            </div>
            <div class='row prices'>
                <div class='priceB'>
                    <div class="input select required"><label class="select required" for="signup_context_size"><abbr title="required">*</abbr> Price</label>
                        <select class="select required custom_dropdown" id="Select2" name="priceB">
                            <option value="240">$240,000</option>
                            <option value="280">$280,000</option>
                            <option value="300">$300,000</option>
                            <option value="325">$325,000</option>
                            <option value="350">$350,000+</option>
                        </select>
                    </div>
                </div>
            </div>
            <div class='fixed_button pricesbB'>
                <button type="button" class="btn btn-inverse continue_price">Continue &rarr;</button>
            </div>
        </div>
        <!-- Endof Townhome Tier 3 -->
        <!-- Form -->
        <div class='contactForm centered hidden' data-behavior='SignUpYourInfo'>
            <div class='row'>
                <div class='large-12 columns'>
                    <h2>How can we get in touch with you?</h2>
                </div>
            </div>
            <div class='row'>
                <div class="large-12 columns">
                    <p class="contact-name">
                        <label>Your name <small>required</small></label>
                        <input type="text" required pattern="[a-zA-Z]+" name="surveyName">
                        <small class="error">Name is required and must be a string.</small>
                    </p>
                    <p class="contact-email">
                        <label>Email <small>required</small></label>
                        <input type="email" required name="surveyEmail">
                        <small class="error">An email address is required.</small>
                    </p>
                    <p class="contact-phone">
                        <input id="contact_phone" type="text" placeholder="Phone Number" value="" name="phone" />
                    </p>
                    <p class="contact-message">
                        <textarea id="contact_message" placeholder="Your Message" name="surveyMessage" rows="15" cols="40"></textarea>
                    </p>
                    <p class="contact-submit">
                        <button type="submit" class="btn btn-inverse" id="submit">Submit</button>
                    </p>
                </div>
            </div>
        </div>  
        <!-- Endof Form -->
        </form>

PHP

<?php 
    if ($_SERVER["REQUEST_METHOD"] == "POST") {
        $name = trim($_POST["surveyName"]);
        $email = trim($_POST["surveyEmail"]);
        $message = trim($_POST["surveyMessage"]);
        $email_body = "";
        $email_body = $email_body . "Name: " . $name . "<br>";
        $email_body = $email_body . "Email: " . $email . "<br>";
        $email_body = $email_body . "Message: " . $message  . "<br>"; 
        $email_body = $email_body   if (isset($level1) && $level1=="custom") echo "checked" . "<br>";
        $email_body = $email_body   if (isset($level1) && $level1=="townhome") echo "checked" . "<br>";


        $mail->SetFrom($email, $name);
        $address = "cmell@thejacobscompanies.net";
        $mail->Subject    = "Contact Form Submission | " . $name;
        $mail->MsgHTML($email_body);
        header("Location: www.thejacobscompanies.net/#services");
        exit;
    }
?>

编辑

根据elitechief21's的评论,我发现了以下代码:

if(!$mail->Send()) {
  echo "Mailer Error: " . $mail->ErrorInfo;
} else {
  echo "Message sent!";
}

我认为它可以放在$mail->MsgHTML($email_body); 下面

注意:但是,您需要将成功的echo替换为header...,但不能同时使用。


回答仅供测试之用

根据elitechief21和我自己已经给出的评论,尝试一下,看看它是否有效。

<?php 
if ($_SERVER["REQUEST_METHOD"] == "POST") {
    $name = trim($_POST["surveyName"]);
    $email = trim($_POST["surveyEmail"]);
    $message = trim($_POST["surveyMessage"]);
    $email_body = "";
    $email_body = $email_body . "Name: " . $name . "<br>";
    $email_body = $email_body . "Email: " . $email . "<br>";
    $email_body = $email_body . "Message: " . $message  . "<br>"; 
if (isset($level1) && $level1=="custom"){$email_body .= "checked";}
if (isset($level1) && $level1=="townhome"){$email_body .= "checked";}
    $mail->SetFrom($email, $name);
    $address = "cmell@thejacobscompanies.net";
    $mail->Subject    = "Contact Form Submission | " . $name;
    $mail->MsgHTML($email_body);
    header("Location: http://www.thejacobscompanies.net/#services");
    exit;
}
?>

POST变量的EDIT

你可以玩以下任何一个:

foreach($var as $key=>$value) {
echo $value;
}

和/或:

foreach($_POST['var'] as $key=>$value) {
echo $value;

您也可以使用它,它将遍历所有POST值:

foreach($_POST as $key=>$value) {
echo "$key=$value";
} 

此外,假设$_POST['item_name_1']

foreach($_POST as $k => $v) {
    if(strpos($k, 'item_name_') === 0) {
        echo "$k = $v";
    }
}