Добавление дополнительного поля в контактную форму - PullRequest
Новая
       30

Добавление дополнительного поля в контактную форму

0 голосов
/ 13 апреля 2019

Я хотел бы добавить дополнительное текстовое поле «Номер телефона» в мою контактную форму. Форма контакта уже существует из шаблона Bootstrap, который я использую, и работает отлично без моего добавления. Возможно, я неправильно написал PHP.

Без каких-либо изменений в PHP контактная форма отправляет электронное письмо без проблем.

HTML 

<form>
    <div>
        <div class="col-md-12">
            <div class="form-group">
                <input class="form-control" type="email" name="email" placeholder="E-mail *" required="">
                <p class="help-block text-danger"></p>
            </div>
        </div>
        <div class="col-md-12">
            <div class="form-group">
                <input class="form-control" type="text" name="number" placeholder="Telephone Number *" required="">
                <p class="help-block text-danger"></p>
            </div>
        </div>
        <div class="col-md-12">
            <div class="form-group">
                <input class="form-control" type="text" name="subject" placeholder="Subject *" required="">
                <p class="help-block text-danger"></p>
            </div>
        </div>
        <div class="col-md-12">
            <div class="form-group">
                <textarea class="form-control" name="message" placeholder="Message *" rows="12" required=""></textarea>
                <p class="help-block text-danger"></p>
            </div>
        </div>
        <div class="col-md-12">
            <p>
                <input class="btn btn-block btn-brand" type="submit" value="Send Message">
            </p>
        </div>
    </div>
</form>
<!-- Ajax response-->
<div class="ajax-response text-center" id="contact-response"></div>

PHP 


  // Mail settings
    $to      = "example@gmail.com";


    // You can put here your email
    $header = "From: example@gmail.com\r\n";
    $header.= "MIME-Version: 1.0\r\n";
    $header.= "Content-Type: text/plain; charset=utf-8\r\n";
    $header.= "X-Priority: 1\r\n";

    if (isset($_POST["name"]) && isset($_POST["email"]) && isset($_POST["number"]) && isset($_POST["subject"]) && isset($_POST["message"])) {

        $content  = "Name: "        . $_POST["name"]    . "\r\n";
        $content .= "Email: "       . $_POST["email"]   . "\r\n";
        $content .= "Number: "      . $_POST["number"]   . "\r\n";
        $content .= "Subject: "     . $_POST["subject"]   . "\r\n";
        $content .= "Message: "     . "\r\n" . $_POST["message"];
        $subject = $_POST["subject"];

        if (mail($to, $subject, $content, $header)) {
            $result = array(
                "message"    => "Thanks for contacting us.",
                "sendstatus" => 1
            );

            echo json_encode($result);
        } else {
            $result = array(
                "message"    => "Sorry, something is wrong.",
                "sendstatus" => 0
            );

            echo json_encode($result);
        }

    }

JAVASCRIPT 


(function($){

    $(document).ready(function() {

        /* ---------------------------------------------- /*
         * Contact form ajax
        /* ---------------------------------------------- */

        $('#contact-form').find('input,textarea').jqBootstrapValidation({
            preventSubmit: true,
            submitError: function($form, event, errors) {
                // additional error messages or events
            },
            submitSuccess: function($form, event) {
                event.preventDefault();

                var submit          = $('#contact-form submit');
                var ajaxResponse    = $('#contact-response');

                var name            = $('#contact-form [name="name"]').val();
                var email           = $('#contact-form [name="email"]').val();
                var phone           = $('#contact-form [name="phone"]').val();
                var message         = $('#contact-form [name="message"]').val();

                $.ajax({
                    type: 'POST',
                    url: 'assets/php/contact.php',
                    dataType: 'json',
                    data: {
                        name: name,
                        email: email,
                        phone: phone,
                        message: message,
                    },
                    cache: false,
                    beforeSend: function(result) {
                        submit.empty();
                        submit.append('<i class="fa fa-cog fa-spin"></i> Wait...');
                    },
                    success: function(result) {
                        if(result.sendstatus == 1) {
                            ajaxResponse.html(result.message);
                            $form.fadeOut(500);
                        } else {
                            ajaxResponse.html(result.message);
                        }
                    }
                });
            }
        });

    });

})(jQuery);

Электронная почта из контактной формы должна быть успешно отправлена.

1 Ответ

0 голосов
/ 13 апреля 2019

В вашем коде HTML и PHP поле вашего телефонного номера называется number, но ваш javascript ищет поле с именем "Телефон", как показано в следующей строке кода: 

var phone           = $('#contact-form [name="phone"]').val();

я хотел бы предложить вам изменить его в вашем HTML и PHP, чтобы поле называлось «phone», как и ожидалось в javascript

что происходит, так это то, что код javascript принимает только определенные поля, перечисленные в коде, а затем передается затем в PHP, но, поскольку он не соответствует имени, это поле оставлено позади, оно не отображается в PHP сценарий, и поскольку он пуст, проверка не проходит

...