单选按钮 php 开机自检

radio button php POST

本文关键字:开机自检 php 单选按钮      更新时间:2023-09-26

我正在尝试为我的网站创建一个反馈表单,其中包含单选按钮,供人们对他们的体验进行排名。

我已经查看了堆栈溢出上的各种选项来提供帮助,但我找不到任何有用的东西。名称等基本字段的工作原理是我在其他形式上使用的。我只是无法获得单选按钮来提交信息。

当我填写表格并单击提交时,没有任何反应,但我的URL更改为www.whateversite.com?xxx_the_options_selected_on_the_form

关于我哪里出错或如何修复它的任何帮助将不胜感激。

这是我当前的HTML - 我试图尽可能多地清理它并整齐地呈现它。

<form id="feedback-form" name="feedback-form" role="form">
            <p>Please rate the following - with 5 being the
            best</p><label for="exp">Overall Experience:</label>
            <div class="radio">
                    <label class="radio-inline" for="exp1">
                    <input id="exp1" name="exp" type="radio" value="option1">1
                    </label>
                    <label class="radio-inline" for="exp2">
                    <input id="exp2" name="exp" type="radio" value="option2">2
                    </label>
                    <label class="radio-inline" for="exp3">
                    <input id="exp3" name="exp" type="radio" value="option3">3
                    </label>
                    <label class="radio-inline" for="exp4">
                    <input id="exp4" name="exp" type="radio" value="option4">4
                    </label>
                    <label class="radio-inline" for="exp5">
                    <input id="exp5" name="exp" type="radio" value="option5">5
                    </label>
            </div><label for="staf">Friendliness of Staff:</label>
            <div class="radio">
                    <label class="radio-inline" for="staf1"><input id=
                    "staf1" name="staf" type="radio" value=
                    "option1">1</label> <label class="radio-inline" for=
                    "staf2"><input id="staf2" name="staf" type="radio"
                    value="option2">2</label> <label class="radio-inline"
                    for="staf3"><input id="staf3" name="staf" type="radio"
                    value="option3">3</label> <label class="radio-inline"
                    for="staf4"><input id="staf4" name="staf" type="radio"
                    value="option4">4</label> <label class="radio-inline"
                    for="staf5"><input id="staf5" name="staf" type="radio"
                    value="option5">5</label>
            </div><label for="clean">Cleanliness of facility:</label>
            <div class="radio">
                    <label class="radio-inline" for="clean1"><input id=
                    "clean1" name="clean" type="radio" value=
                    "option1">1</label> <label class="radio-inline" for=
                    "clean2"><input id="clean2" name="clean" type="radio"
                    value="option2">2</label> <label class="radio-inline"
                    for="clean3"><input id="clean3" name="clean" type=
                    "radio" value="option3">3</label> <label class=
                    "radio-inline" for="clean4"><input id="clean4" name=
                    "clean" type="radio" value="option4">4</label>
                    <label class="radio-inline" for="clean5"><input id=
                    "clean5" name="clean" type="radio" value=
                    "option5">5</label>
            </div><label for="refer">Would you refer a friend?</label>
            <div class="radio">
                    <label class="radio-inline" for="refer1"><input id=
                    "refer1" name="refer" type="radio" value=
                    "option1">1</label> <label class="radio-inline" for=
                    "refer2"><input id="refer2" name="refer" type="radio"
                    value="option2">2</label> <label class="radio-inline"
                    for="refer3"><input id="refer3" name="refer" type=
                    "radio" value="option3">3</label> <label class=
                    "radio-inline" for="refer4"><input id="refer4" name=
                    "refer" type="radio" value="option4">4</label>
                    <label class="radio-inline" for="refer5"><input id=
                    "refer4" name="refer" type="radio" value=
                    "option5">5</label>
            </div><br>
            <div class="form-group has-feedback">
                    <p>If you would like our manager to contact you please
                    provide the following information:</p><label for=
                    "name">Full Name*</label> <input class="form-control"
                    id="name" name="name" placeholder="Your Full Name"
                    type="text"> <i class=
                    "fa fa-user form-control-feedback"></i>
            </div>
            <div class="form-group has-feedback">
                    <label for="email">Email*</label> <input class=
                    "form-control" id="email" name="email" placeholder=
                    "e.g. someone@mail.com" type="email"> <i class=
                    "fa fa-envelope form-control-feedback"></i>
            </div>
            <div class="form-group has-feedback">
                    <label for="phone">Contact Number*</label>
                    <input class="form-control" id="phone" name="phone"
                    placeholder="0400000000" type="phone"> <i class=
                    "fa fa-phone form-control-feedback"></i>
            </div>
            <div class="form-group">
                    <label for="subject">Please share your thoughts on how
                    we may improve your experience</label> <input class=
                    "form-control" id="subject" name="subject" placeholder=
                    "Please leave your thoughts here..." type="text">
                    <i class="fa fa-navicon form-control-feedback"></i>
            </div><input class="btn btn-default" type="submit" value=
            "Submit">
    </form>

我目前的 PHP 是

<?php
session_cache_limiter('nocache');
header('Expires: ' . gmdate('r', 0));
header('Content-type: application/json');
// Enter your email address below.
$to = 'smile@smilehawthorn.com.au';
$subject = 'Website Feedback Received';
if($to) {
    $name = $_POST['name'];
    $email = $_POST['email'];
    $fields = array(
                    0 => array(
                        'text' => 'Name',
                        'val' => $_POST['name']),
                    1 => array(
                        'text' => 'Email address',
                        'val' => $_POST['email']),
                    2 => array(
                        'text' => 'Contact Number',
                        'val' => $_POST['phone']),
                    3 => array(
                        $exp => $_POST['exp']),
                    4 => array(
                        $staf => $_POST['staf']),
                    5 => array(
                        $clean => $_POST['clean']),
                    6 => array(
                        $refer => $_POST['refer']),
                    7 => array(
                        'text' => 'Subject',
                        'val' => $_POST['subject'])
                );
    $message = "";
    foreach($fields as $field) {
        $message .= $field['text'].": " . htmlspecialchars($field['val'], ENT_QUOTES) . "<br>'n";
    }
    $headers = '';
    $headers .= 'From: ' . $name . ' <' . $email . '>' . "'r'n";
    $headers .= "Reply-To: " .  $email . "'r'n";
    $headers .= "MIME-Version: 1.0'r'n";
    $headers .= "Content-Type: text/html; charset=UTF-8'r'n";
    if (mail($to, $subject, $message, $headers)){
        $arrResult = array ('response'=>'success');
    } else{
        $arrResult = array ('response'=>'error');
    }
    echo json_encode($arrResult);
} else {
    $arrResult = array ('response'=>'error');
    echo json_encode($arrResult);
}
?>

最后是检查必填字段反馈的 JS

// feedback forms validation
    //-----------------------------------------------       
    if($("#feedback-form").length>0) {
        $("#feedback-form").validate({
            submitHandler: function(form) {
                var submitButton = $(this.submitButton);
                submitButton.button("loading");
                $.ajax({
                    type: "POST",
                    url: "php/feedback-form.php",
                    data: {
                        "name": $("#feedback-form #name").val(),
                        "phone": $("#feedback-form #phone").val(),
                        "email": $("#feedback-form #email").val(),
                        "exp": $("#feedback-form #exp").val(),
                        "staf": $("#feedback-form #staf").val(),
                        "clean": $("#feedback-form #clean").val(),
                        "refer": $("#feedback-form #refer").val(),
                        "subject": $("#feedback-form #subject").val()
                    },
                    dataType: "json",
                    success: function (data) {
                        if (data.response == "success") {
                            $("#contactSuccess").removeClass("hidden");
                            $("#contactError").addClass("hidden");
                            // Reset Form
                            $("#feedback-form .form-control")
                                .val("")
                                .blur()
                                .parent()
                                .removeClass("has-success")
                                .removeClass("has-error")
                                .find("label")
                                .removeClass("hide")
                                .parent()
                                .find("span.error")
                                .remove();
                            if(($("#contactSuccess").position().top - 80) < $(window).scrollTop()){
                                $("html, body").animate({
                                     scrollTop: $("#contactSuccess").offset().top - 80
                                }, 300);
                            }
                        } else {
                            $("#contactError").removeClass("hidden");
                            $("#contactSuccess").addClass("hidden");
                            if(($("#contactError").position().top - 80) < $(window).scrollTop()){
                                $("html, body").animate({
                                     scrollTop: $("#contactError").offset().top - 80
                                }, 300);
                            }
                        }
                    },
                    complete: function () {
                        submitButton.button("reset");
                    }
                });
            },              
            // debug: true,
            errorPlacement: function(error, element) {
                error.insertBefore( element );
            },
            onkeyup: false,
            onclick: false,
            rules: {
                name: {
                    required: true,
                    minlength: 2
                },
                phone: {
                    required: true,
                    minlength: 10
                },
                email: {
                    required: true,
                    email: true
                }
            },
            messages: {
                name: {
                    required: "Please specify your name",
                    minlength: "Your name must be longer than 2 characters"
                },
                phone: {
                    required: "We need your phone number to contact you if required",
                    email: "Please enter a valid contact number 0401001002 or 0390909090"
                },
                email: {
                    required: "We need your email address to contact you",
                    email: "Please enter a valid email address e.g. name@domain.com"
                }               
            },
            errorElement: "span",
            highlight: function (element) {
                $(element).parent().removeClass("has-success").addClass("has-error");
                $(element).siblings("label").addClass("hide"); 
            },
            success: function (element) {
                $(element).parent().removeClass("has-error").addClass("has-success");
                $(element).siblings("label").removeClass("hide"); 
            }
        });
    };      
    //end feedback form

提前谢谢。

如果您使用 jQuerys ajax 函数来发送表单而不是本机表单标记,请使用以下命令获取选定的单选按钮(参考示例):

$("input[name='refer']:checked").val()

由于我猜您想要一行值范围为的选项,假设 1 - 5,其中 1 是可怕的体验,5 是惊人的,我可能会这样做:

.HTML:

<form action="page-goes-here" method="POST">
  <p>
  Please rate your experience (1 = horrible, 5 = amazing)
  </p>
  <ul class="myList">
   <li>1</li>
   <li><input type="radio" name="userExperience" value="1" /></li>
   <li><input type="radio" name="userExperience" value="2" /></li>
   <li><input type="radio" name="userExperience" value="3" /></li>
   <li><input type="radio" name="userExperience" value="4" /></li>
   <li><input type="radio" name="userExperience" value="5" /></li>
   <li>5</li>
  </ul>
  <input type="submit" name="submitExperience" value="Submit" />
 </form>
 <hr />

.CSS:

.myList li {
  list-style-type: none;
  display: inline-table;
}

.PHP:

if(isset($_POST["submitExperience"])) {
   $userExperience = $_POST["userExperience"]; // This variable should now contain a value between 1-5, depending on what the user chose
}