Question

I have a problem which is likely to be really basic.

I have a newsletter submit from my index.php. It is a 3rd party system (free) and very good and in it's administrator/settings it has the following string:

relative string in Administrator/Settings (to return to page the newsletter submit button is):

index.php?page=mail&

So it sends me back to the index page and then has some php script which updates and confirms I have subscribed to the newsletter.

I have made a popup div with some help of another persons work (permitted as long as i give credit) which includes my newsletter php confirmation code.

Currently it only shows on screen by clicking:

<a href="#" class="topopup">Popup</a>

This is the pop up code which I want to auto-popup from the relative string index.php?page=mail& so I can remove the ahref=# class=topup link.

<div id="toPopup"> 
<div class="close"></div>
<span class="ecs_tooltip">Press Esc to close <span class="arrow"></span></span>
    <div id="popup_content"> <!--your content start-->
      <h2 align="center">All Coles Newsletter System</h2>
      <h3 align="center">bringing News, Birthdays, Events and Invites to your mailbox!</h3>
      <hr align="center" width="75%">
      <p style="text-align:center"> <?php
            if(isset ($_GET['page']))
            {
                if ($_GET['page'] == "mail")
                {
                include("maillist/mailmain.php");
                }

                if ($_GET['page'] == "about")
                {
                include("about.php");
                }
            }else {
                print("THIS IS WHERE THE PHP NEWSLETTER CONFIMATION UPDATES");
            }
        ?>  </p2>
        <hr align="center" width="75%">
        <p style="text-align:center; font-size: 12px;">
        <font style="text-decoration:underline; font-weight:bold;">TIP</font>
       : Remember to check your Junk Mail, and add 'administrator@allcoles.com' to your 
        <font style="text-decoration:underline; font-weight:bold;">SafeSenders</font>
         list.</p>
  </div>
</div>
<div class="loader"></div>
<div id="backgroundPopup"></div>

There is a JS loaded too.

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
});

 /************** 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

My form is a separate php file:

<?php include("globals.php"); ?>

<form action="<?php echo $website.$relative_string;?>" name="subscribe" onsubmit="javascript:return checkEmail(this);" method="post">
  <div id="cell8" class="titlecell2"><h3>Email:</h3></div>
     <div id="cell9" class="inputcell2">
        <input type="text" class="inputfield2" name="email" value="Your Email..." id="email2" maxlength="255" onfocus="this.value='';">
     </div>
     <div id="cell10" class="textcell3">
       <input name="group" type="hidden" id="group[]" value="<?php echo $group; ?>">
       <input name="subscribe" id="sub" type="radio" value="true" checked>
       </span>Subscribe</p>
     </div>
     <div id="cell11" class="buttoncell">
        <button type="submit" name="Submit2" value="Join" id="submitButton2">
        <span>Join</span>
        </button>
     </div>
     <div id="cell8" class="textcell4">
       <input type="radio" name="subscribe" id="unsub" value="false">
       </span>Un-Subscribe</p>
     </div>
  </form>
  <script>
var sub = document.getElementById('sub');
var unsub = document.getElementById('unsub');
var btn = document.getElementById('submitButton2');
sub.onchange = function() //When sub changes
{
if(sub.checked)  //If it's checked
{
    btn.innerHTML = "<span>Join</span>";
}
else // If not..
{
    btn.innerHTML = "<span>Leave</span>";
}
}
unsub.onchange = function() //When unsub changes
{
if(unsub.checked)  //If it's checked
{
    btn.innerHTML = "<span>Leave</span>";
}
else // If not..
{
    btn.innerHTML = "<span>Join</span>";
}
}
btn.onclick = function ()
{
  popupClick();
}
</script>

That's the lot!

Was it helpful?

Solution

you can change popup click function to below

function popupClick() {
        loading(); // loading
        setTimeout(function(){ // then show popup, deley in .5 second
            loadPopup(); // function show popup 
        }, 500); // .5 second

} 

and you can call the popupClick() after form submit like below

print("<script>popupClick()</script>");
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top