确认弹出窗口javascript中不显示复选框值

时间:2014-12-16 09:01:48

标签: javascript php checkbox

我已发送电子邮件发送表单,其中确认弹出窗口显示预览电子邮件信息给用户。在我的代码表单中,文本输入显示正确,但预览弹出窗口中的复选框没有数据显示。我需要在确认框中显示复选框数据。

感谢所有

这是我的代码

的index.php

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title></title>
<meta charset="UTF-8">
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport">
<script src="js/jquery_003.js"></script>

<script src="js/Mail.js"></script>



</head>
<body style="margin: 0px;">

            <div class="onedari_form_wrapper info_form_wrapper ajast_onedari_form mgt0">
                <form id="contactForm">
                    <div class="form_field">
                        <label id="name">Name<span class="red">*</span></label>

                        <input kl_virtual_keyboard_secure_input="on" placeholder="Name" class="custom_input" name="name" type="text" required>
                    </div>
                    <div class="form_field">
                        <label id="mail">Email<span class="red">*</span></label>
                        <input kl_virtual_keyboard_secure_input="on"  class="custom_input" name="mail" type="text" required>
                    </div>
                    <div class="form_field">
                        <label id="age">Age<span class="red">*</span></label><br>
                        <input kl_virtual_keyboard_secure_input="on" style="width: 30%" placeholder="" class="custom_input" name="age" type="text" required>
                    </div>
                    <p style="margin: 0px 0px 8px;"><label id="work">Work<span class="red">*</span></label></p>



                                            <div class="category-wrapper">


 <input  id="CategoryCategory10" class="checkbox" value="10" name="data[]" type="checkbox" >
 <label for="CategoryCategory10">App development</label>
  <br>                                          <input  id="CategoryCategory209" class="checkbox" value="209" name="data[]" type="checkbox"> <label for="CategoryCategory209">System management</label>
          <br>                           
                                            <input  id="CategoryCategory213" class="checkbox" value="213" name="data[]" type="checkbox"> <label for="CategoryCategory213">Web</label><br>
                                            <input id="CategoryCategory19" class="checkbox" value="19" name="data[]" type="checkbox"> <label for="CategoryCategory19">Graphics</label><br>




                <br>

                    <button id="send" class="submit bg_red" type="button" name="send">Submit</button>

                </form>
            </div>




</body>
</html>

在mail.js

$(function(){
    // sendForm
    $("#send").on("click", function(e){
        e.preventDefault();
        chackError("#contactForm");
    });

    $(document).on("click", ".layerOff", function(){
        $(".overlay").remove();
    });
});


function chackError(selector){
    var $form = $(selector);
    var name = $form.find("input[name='name']").val();
    var mail = $form.find("input[name='mail']").val();
    var age = $form.find("input[name='age']").val();
    /*var work = $form.find("textarea[name='work']").val();*/

    var dataval =  document.getElementsByName("data[]"); 
             // or document.querySelectorAll('[name="summer[]"]');

var checked = [].filter.call( dataval , function( v ){
    return v.checked;
});



    $form.find(".coution").remove();
    var error_frag = false;


    if ( checked.length < 1 ) {
  $("#work").append("<span class='coution'><br>Work field reqire</span>");
        error_frag = true;
        error_kind = "#work";       
}

    if(age == ""){
        $("#age").append("<span class='coution'><br>Age field reqire</span>");
        error_frag = true;
        error_kind = "#age";
    }
    if(mail == ""){
        $("#mail").append("<span class='coution'><br>email field reqire</span>");
        error_frag = true;
        error_kind = "#mail";
    }
    if(name == ""){
        $("#name").append("<span class='coution'><br>Name field reqire</span>");
        error_frag = true;
        error_kind = "#name";
    }
    if(error_frag === false){


         var theAnswer = confirm("Please confirm that the following Information is correct:\n  Name:" +name+"\nAge :"+age+"\nJob :"+checked ); //if the user presses the "OK" button display the message "Javascript is cool!!" 




    }

     if (theAnswer){sendForm(); }

    else{
        var targetY = $(error_kind).offset().top;
        var headerH = $("#header").height();
        var ajast = ($(window).width() >= 761)? 80 : 20;
        $("html, body").animate({ scrollTop: targetY - headerH - ajast}, 'fast');
    }
}


function sendForm(){


    var post_data = $("#contactForm").serialize();
    $("#contactForm").find("input, checkbox, textarea").val("").end().find(":checked").prop("checked", false);
    $.post("sendMail.php",
        post_data,
        function(data){
            if(data.success === false){
                alert("error");
                $(".overlay").remove();
            }else{
                $("body").append("<div class='overlay'></div>");
                $(".overlay").html(data.message);
                $("html, body").animate({ scrollTop: 0}, 'fast');

            }
        },
        "json"
    );
    return false;
}

0 个答案:

没有答案