我的JQM表单上缺少什么？

Question

我正在尝试通过应用程序将信息发送到我的电子邮件中，但是提交时我没有响应。 任何帮助都是极好的。 我确实在寻找答案，但是找不到正确的解决方案。

HTML和JQUERY移动1.4.3

<div data-role="page" id="step7">
    <div data-role="header">

        <div class="logo"> </div>

        <div data-role="navbar" data-position="fixed">
            <div class="ui-nodisc-icon">
                <ul>
                    <li><a href="#step5" data-transition="slide" data-icon="arrow-l" >Back</a></li>
                </ul>
            </div>
        </div>

    </div>


    <div data-role="content">
        <div class="text">
            <h2>What's next?</h2>
            <h3>Let's recap</h3>

            <li> Hospice is about care</li>
            <li> Hopsice is about comfort</li>
            <li> Hospice has many misconceptions</li>
            <li> Hospice is about family </li>

            <h3>If you have more questions, ask your health care provider to have someone come and talk to you.</h3>
        </div>

        <div data-role="content">
            <div class="text">
                <h1>Please take our survey</h1>
            </div>

            <div class="contact-thankyou" style="display: none;">
                Thank you.  Your message has been sent.  We will get back to you as soon as we can.
            </div>
            <div class="contact-form">
                <div data-role="fieldcontain" class="text-field">
                    <label for="name">Your Name:</label>
                    <input type="text" name="firstname" value="" placeholder="" id="firstname" />
                </div>
                <div data-role="fieldcontain" class="text-field">
                    <label for="age">Age:</label>
                    <input type="text" name="surname" value="" placeholder="" id="surname" />
                </div>
                <div data-role="fieldcontain" class="text-field">
                    <label for="gender">Gender:</label>
                    <input type="text" name="gender" value="" placeholder="" id="surname" />
                </div>
                <div data-role="fieldcontain" class="text-field">
                    <label for="email">Email Address:</label>
                    <input type="email" name="email" value="" placeholder="" id="email"  />
                </div>
                <div data-role="fieldcontain" class="text-field">
                    <label for="mobilephone">Phone Number:</label>
                    <input type="number" name="mobilephone" value="" placeholder="" id="mobilephone" />
                </div>
                <div data-role="fieldcontain" class="text-field">
                    <label for="way">Where are you?</label>
                    <select name="state" id="state">
                        <option value="" data-placeholder="true">Please select your state</option>
                        <option value="HOME">Home</option>
                        <option value="ILF">Independent Living Facility</option>
                        <option value="ALF">Assited Living Facility</option>
                        <option value="LTF">Long Term Care Facility</option>
                        <option value="OF">A Doctors Office</option>
                        <option value="HH">With a Home Health Provider</option>
                        <option value="OO">Other</option>
                    </select>
                </div>
                <div data-role="fieldcontain" class="text-field">
                    <label for="rate">Rate this App</label>
                    <select name="state" id="state">
                        <option value="" data-placeholder="true">Please select your state</option>
                        <option value="one">1- Bad </option>
                        <option value="two">2- Not Good </option>
                        <option value="three">3 - Average</option>
                        <option value="four">4 - Good</option>
                        <option value="five">5 - Great</option>
                        <</select>
                    </div>
                    <div data-role="fieldcontain" class="text-field">
                        <label for="message">Message*:</label>
                        <textarea name="message" id="message" placeholder="" class="required"></textarea>
                    </div>
                    <div class="send"><a href="javascript:;" data-role="button" data-iconpos="right" id="send-feedback">send the survey</a></div>
                </div><!-- //.contact-form -->
            </div><!-- /content -->

        </div><!-- /page -->



        <div data-role="footer" data-position="fixed">
            <div data-role="navbar"><br>
                <div class="ui-nodisc-icon">
                    <ul>
                        <li><a href="#home" data-icon="home" >Home</a></li>
                        <li><a href=# data-icon="mail">Contact Us</a></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>

contactus.js ---> Javascript

$('#send-feedback').live("click", function() {
    var url = 'api/send.php';
    var error = 0;
    var $contactpage = $(this).closest('.content-thankyou');
    var $contactform = $(this).closest('.contact-form');
    $('.required', $contactform).each(function (i) {
        if ($(this).val() === '') {
            error++;
        }
    }); // each
    if (error > 0) {
            alert('Please fill in all the mandatory fields. Mandatory fields are marked with an asterisk *.');
    } else {
        var name = $contactform.find('input[name="name"]').val();
        var age = $contactform.find('input[name="age"]').val();
        var gender = $contactform.find('input[name="gender"]').val();
        var way = $contactform.find('select[name="way"]').val();
        var mobilephone = $contactform.find('input[name="mobilephone"]').val();
        var email = $contactform.find('input[name="email"]').val();
        var rate = $contactform.find('input[name="rate"]').val();
        var message = $contactform.find('textarea[name="message"]').val();  

        //submit the form
        $.ajax({
            type: "GET",
            url: url,
            data: {firstname:firstname, surname:surname, state: state, mobilephone: mobilephone, email: email, message: message},
            success: function (data) {
                if (data == 'success') {
                    // show thank you
                    $contactpage.find('.contact-thankyou').show();
                    $contactpage.find('.contact-form').hide();
                }  else {
                    alert('Unable to send your message. Please try again.');
                }
            }
        }); //$.ajax

    }
    return false;
});

Send.php ---> PHP

<?php
header('content-type: application/json; charset=utf-8');

if (isset($_GET["firstname"])) {
    $firstname = strip_tags($_GET['firstname']);
    $surname = strip_tags($_GET['surname']);
    $email = strip_tags($_GET['email']);
    $mobilephone = strip_tags($_GET['mobilephone']);
    $state = strip_tags($_GET['state']);
    $message = strip_tags($_GET['message']);
    $header = "From: ". $firstname . " <" . $email . ">rn"; 

    $ip = $_SERVER['REMOTE_ADDR'];
    $httpref = $_SERVER['HTTP_REFERER'];
    $httpagent = $_SERVER['HTTP_USER_AGENT'];
    $today = date("F j, Y, g:i a");    

    $recipient = 'jkublank@cimahospice.COM';
    $subject = 'Contact Form';
    $mailbody = "
First Name: $firstname
Last Name: $surname
Email: $email
Mobile Phone: $mobilephone
State: $state
Message: $message

IP: $ip
Browser info: $httpagent
Referral: $httpref
Sent: $today
";
    $result = 'success';

    if (mail($recipient, $subject, $mailbody, $header)) {
        echo json_encode($result);
    }
}
?>

Answer 1

首先要注意。 为什么不使用表单元素和提交按钮？您应该通过POST方法（没有GET）提交表单。

您在这里有PHP和GET的示例

http://www.w3schools.com/php/php_ajax_php.asp

在这里JQUERY + PHP + POST

http://blog.teamtreehouse.com/beginners-guide-to-ajax-development-with-php