Solved

jQuery UI dialog box autoopen does not work when the page loads

Posted on 2015-01-20
5
181 Views
Last Modified: 2015-02-03
I am trying to show a auto pop up on the homepage as soon as the page loads. I am using jQuery UI but its not showing. The website is built in WordPress. here is the website link dev.startingpointnh.org

here is the code I am using in header.php

	    <?php if(is_home() || is_front_page()) { ?>
		<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css" />
		<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
		<script type="text/javascript">
  $(document).ready(function(){
   $('#dialog').dialog({
		autoOpen: true,
		modal: true,
		width: 620,
		buttons: {
		"Close This Message": function() {
		 $( this ).dialog( "close" );
		}
	}
	});
  });
</script>
<?php } ?>

Open in new window


and in the footer.php I have

		<?php if(is_home() || is_front_page()) { ?>
	<div id="dialog" title="Starting Point Safety Warning">
	<h1 style="text-align: center; ">
	Do not use this website if you suspect your computer is being monitored.</h1>
<div style="text-align: center; ">
	<strong>Website and email history may be viewable even if you delete your browser history and delete files.<br />
	Access a safe computer to use the internet.</strong></div>
<div style="text-align: center; ">
	&nbsp;</div>
<div style="text-align: center; ">
	<strong>Please note the &quot;Leave this site quickly&quot; item on the top of every page should you need to close this website quickly.</strong></div>
<div style="text-align: center; ">
	&nbsp;</div>
<h2 style="text-align: center; ">
	Warning!</h2>
<div style="text-align: center; ">
	<strong>If you are in immediate danger, please dial 911.</strong></div>
<div style="text-align: center; ">
	<strong>24-Hour Hotline 800.336.3795</strong></div>
<div style="text-align: center; ">
	&nbsp;</div>
<div style="text-align: center; ">
	<em>Close window by pressing ESC key or button below.</em></div>
	</div> 
		<?php }?>

Open in new window


What am I missing?

Thanks and appreciate it
0
Comment
Question by:niceoneishere
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 2
5 Comments
 
LVL 35

Accepted Solution

by:
Robert Schutt earned 500 total points
ID: 40561431
You load a lot of javascript files on your page. For some reason $ is undefined but you can use the full variable name jQuery instead of the shorthand:
  jQuery(document).ready(function(){
   jQuery('#dialog').dialog({
		autoOpen: true,
		modal: true,
		width: 620,
		buttons: {
		"Close This Message": function() {
		 jQuery( this ).dialog( "close" );
		}
	}
	});
  });

Open in new window

0
 
LVL 1

Author Comment

by:niceoneishere
ID: 40561959
Thanks that worked perfectly thanks. I do have one more question, How can I make the dialog box appear only one time. Now every time the home page is loaded the popup shows. I just want to show only once.

Thanks again
0
 
LVL 35

Expert Comment

by:Robert Schutt
ID: 40561996
If you want to show it once per "browser" you could do it client side with a cookie but maybe that's a bit old school...

If you want to show it once per session you could add server side code to store a session variable in php and add a check for that variable to your current check: if(is_home() || is_front_page())
0
 
LVL 35

Expert Comment

by:Robert Schutt
ID: 40562019
a little example taken from http://php.net/manual/en/session.examples.basic.php:
<?
error_reporting(-1);
session_start();
if (!isset($_SESSION['count'])) {
  $_SESSION['count'] = 0;
} else {
  $_SESSION['count']++;
}
?>

Open in new window

Then your check could become:
<?php if((is_home() || is_front_page()) && $_SESSION['count'] == 0) { ?>

Open in new window

To test you can show the counter on your page:
counter: <?= $_SESSION['count'] ?>

Open in new window

You may also need some client side code because somebody could click a link and then click the back button...
0
 
LVL 1

Author Closing Comment

by:niceoneishere
ID: 40587081
Thanks
0

Featured Post

Why Off-Site Backups Are The Only Way To Go

You are probably backing up your data—but how and where? Ransomware is on the rise and there are variants that specifically target backups. Read on to discover why off-site is the way to go.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I annotated my article on ransomware somewhat extensively, but I keep adding new references and wanted to put a link to the reference library.  Despite all the reference tools I have on hand, it was not easy to find a way to do this easily. I finall…
Many old projects have bad code, but the budget doesn't exist to rewrite the codebase. You can update this code to be safer by introducing contemporary input validation, sanitation, and safer database queries.
The purpose of this video is to demonstrate how to Test the speed of a WordPress Website. Site Speed is an important metric of a site’s health. Slow site speed can result in viewers leaving your site quickly and not seeing your content. This…
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.

624 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question