简体   繁体   English

我的JQM表单上缺少什么?

[英]What am I missing on my JQM Form?

Im trying to send the info to my email from an app, but i am getting a non-responsive click when I submit. 我正在尝试通过应用程序将信息发送到我的电子邮件中,但是提交时我没有响应。 Any help would be awesome. 任何帮助都是极好的。 I did look for answers, but I could not find the right solution. 我确实在寻找答案,但是找不到正确的解决方案。

HTML AND JQUERY MOBILE 1.4.3 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 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 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);
    }
}
?>

first thing to notice. 首先要注意。 Why don't you use form element and submit button?, and you should submit form via POST method, no GET. 为什么不使用表单元素和提交按钮?您应该通过POST方法(没有GET)提交表单。

You have here example for PHP and GET 您在这里有PHP和GET的示例

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

and here JQUERY + PHP + POST 在这里JQUERY + PHP + POST

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

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM