Corectly填充的bootstrap联系表单不断返回php代码

时间:2017-11-14 12:51:12

标签: javascript php twitter-bootstrap forms email

我有这个问题。在我的第二个网站上,我想添加一个发送电子邮件的联系表单。我找到了一个完全符合我要求的bootstrap版本。问题是,当我正确地填充所有列时,它只是查看"裸体"来自.php的php代码。请帮助我理解为什么以及如何解决它?

HTML     

      <div class="messages"></div>

      <div class="controls">

          <div class="row">
              <div class="col-md-6">
                  <div class="form-group">
                      <label for="form_name">Jméno *</label>
                      <input id="form_name" type="text" name="name" class="form-control" placeholder="Vaše křestní jméno *" required="required" data-error="Firstname is required.">
                      <div class="help-block with-errors"></div>
                  </div>
              </div>
              <div class="col-md-6">
                  <div class="form-group">
                      <label for="form_lastname">Příjmení *</label>
                      <input id="form_lastname" type="text" name="surname" class="form-control" placeholder="Vaše příjmení *" required="required" data-error="Lastname is required.">
                      <div class="help-block with-errors"></div>
                  </div>
              </div>
          </div>
          <div class="row">
              <div class="col-md-6">
                  <div class="form-group">
                      <label for="form_email">Email *</label>
                      <input id="form_email" type="email" name="email" class="form-control" placeholder="Váš platný email *" required="required" data-error="Valid email is required.">
                      <div class="help-block with-errors"></div>
                  </div>
              </div>
              <div class="col-md-6">
                  <div class="form-group">
                      <label for="form_phone">Telefon</label>
                      <input id="form_phone" type="tel" name="phone" class="form-control" placeholder="Váš telefon">
                      <div class="help-block with-errors"></div>
                  </div>
              </div>
          </div>
          <div class="row">
              <div class="col-md-12">
                  <div class="form-group">
                      <label for="form_message">Vaše zpráva *</label>
                      <textarea id="form_message" name="message" class="form-control" placeholder="Vaše zpráva *" rows="4" required="required" data-error="Please,leave us a message."></textarea>
                      <div class="help-block with-errors"></div>
                  </div>
              </div>
              <div class="col-md-12">
                  <input type="submit" class="btn btn-success btn-send" value="Odeslat">
              </div>
          </div>
          <div class="row">
              <div class="col-md-12">
                  <br><p class="text-muted"><strong>*</strong> Tyto pole jsou povinná.</p>
              </div>
          </div>
      </div>

</form>

PHP

<?php

$from = 'email@email.com';
$sendTo = 'email@email.cz';
$subject = 'Nová zpráva z Vašeho webu';
$fields = array('name' => 'Name', 'surname' => 'Surname', 'phone' => 'Phone', 'email' => 'Email', 'message' => 'Message'); 
$okMessage = 'Děkuji! Vaše zpráva byla úspěšně odeslána. ';
$errorMessage = 'Omlouvám se, ale došlo k nečekaně chybě. Zkuste to prosím později.';

error_reporting(0);
error_reporting(E_ALL & ~E_NOTICE);

try
{

    if(count($_POST) == 0) throw new \Exception('Form is empty');

    $emailText = "You have a new message from your contact form\n=============================\n";

    foreach ($_POST as $key => $value) {
        // If the field exists in the $fields array, include it in the email 
        if (isset($fields[$key])) {
            $emailText .= "$fields[$key]: $value\n";
        }
    }

    // All the neccessary headers for the email.
    $headers = array('Content-Type: text/plain; charset="UTF-8";',
        'From: ' . $from,
        'Reply-To: ' . $from,
        'Return-Path: ' . $from,
    );

    // Send email
    mail($sendTo, $subject, $emailText, implode("\n", $headers));

    $responseArray = array('type' => 'success', 'message' => $okMessage);
}
catch (\Exception $e)
{
    $responseArray = array('type' => 'danger', 'message' => $errorMessage);
}


// if requested by AJAX request return JSON response
if (!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
    $encoded = json_encode($responseArray);

    header('Content-Type: application/json');

    echo $encoded;
}
// else just display the message
else {
    echo $responseArray['message'];
}

JS

$(function () {

// init the validator
// validator files are included in the download package
// otherwise download from http://1000hz.github.io/bootstrap-validator

$('#contact-form').validator();


// when the form is submitted
$('#contact-form').on('submit', function (e) {

    // if the validator does not prevent form submit
    if (!e.isDefaultPrevented()) {
        var url = "contact.php";

        // POST values in the background the the script URL
        $.ajax({
            type: "POST",
            url: url,
            data: $(this).serialize(),
            success: function (data)
            {
                // data = JSON object that contact.php returns

                // we recieve the type of the message: success x danger and apply it to the 
                var messageAlert = 'alert-' + data.type;
                var messageText = data.message;

                // let's compose Bootstrap alert box HTML
                var alertBox = '<div class="alert ' + messageAlert + ' alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>' + messageText + '</div>';

                // If we have messageAlert and messageText
                if (messageAlert && messageText) {
                    // inject the alert to .messages div in our form
                    $('#contact-form').find('.messages').html(alertBox);
                    // empty the form
                    $('#contact-form')[0].reset();
                }
            }
        });
        return false;
    }
})

});

php和js代码都是表单文件中的分隔文件。因此,我不确定我是否遗漏了某些内容,或者代码中是否存在错误。我很乐意为你提供帮助:))

谢谢

1 个答案:

答案 0 :(得分:0)

如果你得到纯PHP代码(基本上没有编译),那么它是: 1)Mime类型没有在网站上设置,如...网络服务器不处理.php文件,因此返回它们就好像它们是文本一样。 2)PHP未安装。