dsepcxw181184853
2017-06-03 17:54
浏览 56
已采纳

如何在bootstrap模式中编写表单的成功消息?

SOLVED

Ok, I solved the problem with AJAX but I had to delete my WordPress because it didn't work with it so later I will upload back by individual directory. Luckily I don't need it for my index. The working code is by CodexWorld. I hope I help someone who is helpless.


I am searching for solution all day but I don't get relevant solution anywhere. Other similar questions here are old, maybe there are fresh solution.

So I am using Bootstrap the first time (files are on the themes of Wordpress). I started to build a contact form in Modal and if I hit submit the window closes, I get the e-mail, but the success-message only shows if I reopen it. I tried every solution I found on internet.

I am not familiar with javascript and jquery, I don't know how to use it.

In the footer I implemented:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

In index there is the form with Modal:

 <!-- Modal -->
    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
    <form class="form-horizontal clearfix" id="contact-form" name="contact" role="form" method="post" action="index.php">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title" id="myModalLabel">Küldj egy üzenetet</h4>
          </div>
          <div class="modal-body">

</div>


<div class="form-group">
    <label class="col-sm-2 control-label">Itt landol</label>
    <div class="col-sm-10">
      <input class="form-control" id="disabledInput" type="text" placeholder="hello@kanizsaipatricia.hu" disabled>
    </div>
  </div>

    <div class="form-group">
        <label for="name" class="col-sm-2 control-label">Név</label>
        <div class="col-sm-10">
            <input type="text" class="form-control" id="name" name="name" placeholder="Minta János" value="<?php echo htmlspecialchars($_POST['name']); ?>">
            <?php echo "<p class='text-danger'>$errName</p>";?>
        </div>
    </div>
    <div class="form-group">
        <label for="email" class="col-sm-2 control-label">Email</label>
        <div class="col-sm-10">
            <input type="email" class="form-control" id="email" name="email" placeholder="valaki@email.hu" value="<?php echo htmlspecialchars($_POST['email']); ?>">
            <?php echo "<p class='text-danger'>$errEmail</p>";?>
        </div>
    </div>
    <div class="form-group">
        <label for="message" class="col-sm-2 control-label">Üzenet</label>
        <div class="col-sm-10">
            <textarea class="form-control" placeholder="Ide írd az üzenetet" rows="4" name="message"><?php echo htmlspecialchars($_POST['message']);?></textarea>
            <?php echo "<p class='text-danger'>$errMessage</p>";?>
        </div>
    </div>
        </div>

                        <?php echo $result; ?>

      <div class="modal-footer">
        <button type="button" class="btn btn-cancel hvr-fade" data-dismiss="modal">Mégsem</button>
        <input type="submit" id="submit" name="submit" data-toggle="modal" data-target="#resultModal" value="Elküldöm" class="btn btn-info hvr-wobble-horizontal">
    </div>  
</pop:form>
      </div>
    </div>

The php code behind the form:

if (isset($_POST["submit"])) {
    $name = $_POST['name'];
    $email = $_POST['email'];
    $message = $_POST['message'];
    $from = 'Üzenetküldő űrlap'; 
    $to = 'hello@kanizsaipatricia.hu'; 
    $subject = 'Új üzenet formon keresztül';

    $body = "Feladó: $name
 E-Mail: $email
 Üzenet:
 $message";

    // Check if name has been entered
    if (!$_POST['name']) {
        $errName = 'Kérlek, add meg a neved!';
    }

    // Check if email has been entered and is valid
    if (!$_POST['email'] || !filter_var($_POST['email'], FILTER_VALIDATE_EMAIL)) {
        $errEmail = 'Nem érvényes e-mail cím!';
    }

    //Check if message has been entered
    if (!$_POST['message']) {
        $errMessage = 'Nem írtál üzenetet.';
    }


// If there are no errors, send the email
if (!$errName && !$errEmail && !$errMessage) {
    if (mail ($to, $subject, $body, $from)) {
        $result='<div class="alert alert-success noshadow">Elküldve.</div>';
    } else {
        $result='<div class="alert alert-danger noshadow">Sajnálom, hiba lépett fel az üzenet küldése közben. Próbáld újra!</div>';
    }
}
}

I'm open minded for any solution in any language! Please help!

  • 写回答
  • 好问题 提建议
  • 追加酬金
  • 关注问题
  • 邀请回答

1条回答 默认 最新

相关推荐 更多相似问题