Databases
StackOverflow2013
Postsdbo
POHow do I keep jquery modal box open when the form inside poses an error?
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POHow do I keep jquery modal box open when the form inside poses an error?
    text
    copied!<p>I have a simple jquery modal box on my site. I'm new at jquery so I'm not sure how to keep the box open if an error is posed on the form that is being submitted. If submitted correctly redirect.</p> <p>As of now when there is an error it reloads the page and have to press pop up again to view error.</p> <p>Thanks in advance.</p> <pre><code>if(isset($_POST['submit'])) { $email = $_POST['email']; if(empty($_POST['name']) || empty($_POST['email'])) { $error = "Please enter the info in the fields that are marked &lt;br /&gt; with &amp;#042;"; }elseif(!filter_var($email, FILTER_VALIDATE_EMAIL)){ $error_email = "Please enter a valid email address"; }else{ $success = true; $success = "Thank You"; mysql_query("INSERT INTO watch_list (name, email) VALUES('".$_POST['name']."', '".$_POST['email']."')") or die(mysql_error()); header( 'Location: /watch.php' ); } } &lt;div class="play_wrapper"&gt; &lt;div class="play"&gt; &lt;a href="#" class="topopup"&gt;&lt;img src="/styles/images/lx_play.png"/&gt;&lt;/a&gt; &lt;div id="toPopup"&gt; &lt;div id="popup_content"&gt; &lt;div class="vid_form_text"&gt; Please enter your name and email to watch the film. &lt;span class="green"&gt;Thank you.&lt;/span&gt; &lt;/div&gt; &lt;?php if(isset($success)) { ?&gt; &lt;div class="success_watch"&gt;Thank You!&lt;/div&gt; &lt;?php } ?&gt; &lt;?php if(isset($error)) { ?&gt; &lt;div class="error_watch"&gt; &lt;?php echo $error; ?&gt; &lt;/div&gt; &lt;?php } ?&gt; &lt;?php if(isset($error_email)) { ?&gt; &lt;div class="error_watch"&gt; &lt;?php echo $error_email; ?&gt; &lt;/div&gt; &lt;?php } ?&gt; &lt;form method="post" action="#"&gt; &lt;div class="form_text_sign_up_required"&gt; All fields marked with an asterisk * are required &lt;/div&gt; &lt;div class="form_text_sign_up"&gt; Name&amp;#042; &lt;/div&gt; &lt;input type="text" name="name" value="&lt;?php if(isset($_POST['name'])) {echo $_POST['name'];} ?&gt;" /&gt; &lt;br /&gt;&lt;br /&gt; &lt;div class="form_text_sign_up"&gt; Email&amp;#042; &lt;/div&gt; &lt;input type="text" name="email" value="&lt;?php if(isset($_POST['email'])) { echo $_POST['email'];} ?&gt;" /&gt;&lt;br /&gt;&lt;br /&gt; &lt;input type='submit' name='submit' value='submit' class='post'/&gt; &lt;/form&gt; &lt;/div&gt; &lt;!--your content end--&gt; &lt;/div&gt; &lt;!--toPopup end--&gt; &lt;div class="loader"&gt;&lt;/div&gt; &lt;div id="backgroundPopup"&gt;&lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;script&gt; jQuery(function($) { $("a.topopup").click(function() { loading(); // loading setTimeout(function(){ // then show popup, deley in .5 second loadPopup(); // function show popup }, 500); // .5 second return false; }); /* event for close the popup */ $("div.close").hover( function() { $('span.ecs_tooltip').show(); }, function () { $('span.ecs_tooltip').hide(); } ); $("div.close").click(function() { disablePopup(); // function close pop up }); $(this).keyup(function(event) { if (event.which == 27) { // 27 is 'Ecs' in the keyboard disablePopup(); // function close pop up } }); $("div#backgroundPopup").click(function() { disablePopup(); // function close pop up }); $('a.livebox').click(function() { alert('Hello World!'); return false; }); /************** start: functions. **************/ function loading() { $("div.loader").show(); } function closeloading() { $("div.loader").fadeOut('normal'); } var popupStatus = 0; // set value function loadPopup() { if(popupStatus == 0) { // if value is 0, show popup closeloading(); // fadeout loading $("#toPopup").fadeIn(0500); // fadein popup div $("#backgroundPopup").css("opacity", "0.7"); // css opacity, supports IE7, IE8 $("#backgroundPopup").fadeIn(0001); popupStatus = 1; // and set value to 1 } } function disablePopup() { if(popupStatus == 1) { // if value is 1, close popup $("#toPopup").fadeOut("normal"); $("#backgroundPopup").fadeOut("normal"); popupStatus = 0; // and set value to 0 } } /************** end: functions. **************/ }); // jQuery End &lt;/script&gt; </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload