Comment obtenir Twitter Bootstrap modaux de rester ouvert sur le formulaire soumettre?
Je suis en train de voir si il existe un moyen relativement simple (je ne suis pas très habile à JQuery) pour garder le modal ouverte après la soumission d'un formulaire. (Le formulaire est contenue dans le modal).
Si la forme est réussie ou il y a des erreurs, mon PHP va leur montrer, mais le modal se ferme dès que le bouton "soumettre" est pressé.
Si je recharge le formulaire, je peux le succès ou un message d'erreur si tout fonctionne bien, mais je préfère l'utilisateur final pour voir le message, puis cliquez sur pour fermer la modale par la suite.
Je peux poster mon code si ça peut aider.
Merci.
<?php
$success_message = "<h3 class='success'>Thank you, your message has been sent.</h3>";
$success = false; //we assume it and set to true if mail sent
$error = false;
//set and sanitize our form field values
$form = array(
'Name' => $sanitizer->text($input->post->name),
'Email' => $sanitizer->email($input->post->email),
'Phone number' => $sanitizer->text($input->post->phone),
'Type of client' => $sanitizer->text($input->post->client_type),
'Service client is after' => $sanitizer->text($input->post->service),
'Further information' => $sanitizer->textarea($input->post->information)
);
$required_fields = array(
'name' => $input->post->name,
'email' => $input->post->email
);
//check if the form was submitted
if($input->post->submit) {
//determine if any fields were ommitted or didn't validate
foreach($required_fields as $key => $value) {
if( trim($value) == '' ) {
$error_message = "<h3 class='error'>Please check that you have completed all the required fields.</h3>";
$error = true;
}
}
//if no errors, email the form results
if(!$error) {
$message = "";
$to_name = "My name";
$to = "[email protected]";
$subject = "Contact Form request";
$from_name = "My Website";
$from = "[email protected]";
$headers = "From: $from_name <$from>";
foreach($form as $key => $value) $message .= "$key: $value\n";
require_once("./scripts/PHPMailer/class.phpmailer.php");
$mail = new PHPMailer();
$mail->CharSet = "UTF8";
$mail->FromName = $from_name;
$mail->From = $from;
$mail->AddAddress($to, $to_name);
$mail->Subject = $subject;
$mail->Body = $message;
if ($mail->Send()) {
$success = true;
}
}
}
?>
<!-- Contact form made available from every page -->
<div class="modal hide fade" id="form">
<div class="modal-header">
<a class="close" data-dismiss="modal">×</a>
<h3>Get in touch</h3>
</div>
<div class="modal-body">
<?php if(!$success) {
if($error) {
echo $error_message; //or pull from a PW field
}
?>
<form action="./" method="post" class="modal-form">
<div class="row-fluid">
<fieldset class="span6">
<label for="name">Name:</label>
<input type="text" name="name" required>
<label for="email">Email:</label>
<input type="email" name="email" required>
<label for="phone">Phone:</label>
<input type="tel" name="phone">
</fieldset>
<fieldset class="span6">
<label for="client_type">I am a...</label>
<select name="client_type">
<option>Private student</option>
<option>Business</option>
<option>Unsure</option>
</select>
<label for="service">I am interested in...</label>
<select name="service">
<option>Private tuition</option>
<option>Group tuition</option>
<option>Translation</option>
<option>Unsure</option>
</select>
</fieldset>
</div> <!-- /.row-fluid -->
<div class="row-fluid">
<fieldset>
<label for="information">Further information:</label>
<textarea name="information" name="information" id="information" class="span12"></textarea>
</fieldset>
<button type="submit" name="submit" value="Submit" class="btn">Submit</button>
</div> <!-- /.row-fluid -->
</form>
<?php } else {
echo $success_message;
} ?>
</div> <!-- /.modal-body -->
<div class="modal-footer">
</div> <!-- /.modal-footer -->
</div> <!-- /#contact_form.modal hide fade -->
ne vous soumettez votre formulaire via ajax post?
désolé Pierre, je ne suis pas trop sûr, j'utilise phpmailer et natives de php. Ne savent pas que je suis à l'aide d'ajax.
désolé Pierre, je ne suis pas trop sûr, j'utilise phpmailer et natives de php. Ne savent pas que je suis à l'aide d'ajax.
OriginalL'auteur onjegolders | 2012-08-08
Vous devez vous connecter pour publier un commentaire.
Lorsque vous le formulaire est soumis, la page est rechargée, même si le
action
de la forme est la même page (vide à l'action, à la même page).Je pense que vous voulez ré-ouvrir le modal une fois que la page est à nouveau chargé. En supposant que vous utilisez un
method="post"
forme, votre code doit être quelque chose comme ça :Avis le php balises d'ouverture et de clôture, et les supports trop. Vous pouvez faire ce que JAMAIS vous voulez sur le côté serveur (php côté) aussi longtemps que vous produisez valide en HTML ou JS.
ok merci encore, je vais essayer cela dans la matinée, quand je suis frais si pas, je vais faire plus de mal que de bien!
juste eu à essayer et à chaque fois que j'ajoute un peu de javascript dans mon code php, il provoque la modale de ne pas charger de. Je tiens à souligner que la forme est un fichier include et a toute sa logique en tête, suivie par le formulaire html lui-même.
ok juste allé de l'avant et n'a comme vous l'avez fait à l'ajouter dans mes balises d'en-tête (sentais étrange que c'est tellement loin de mon formulaire include) et ça fonctionne, merci! Cela signifie également qu'une fois fermée, si quelqu'un ouvre la modale de nouveau sans rafraichissement de la page, ils reçoivent le message de réussite une fois de plus, mais pas sûr que l'on peut éviter?
OriginalL'auteur Sherbrow
Afin de ne pas fermer la fenêtre modale, c'est de ne pas actualiser la page entière, vous devez soumettre le formulaire de valeurs pour votre script php via ajax appel.
Pour des raisons de simplicité, je vais utiliser jQuery ici
OriginalL'auteur Peter Pajchl
Vous pouvez également utiliser fenêtre.stop() qui empêchera le modèle de la fermeture et de l'ensemble de l'actualiser tous ensemble, c'est comme en cliquant sur le bouton arrêter dans le navigateur.
OriginalL'auteur Patrick Bateman