...

View Full Version : Javascript On-click Popup, please help



ghostcorps
05-24-2005, 07:20 AM
HI Guys

I am working on my gf's website (http://www.fleshmetal.com.au) (my first project). And am trying to add an On-click popup window for a sizechart. But try as i might I cannot get it to do its thing.

The site itself is a PHP Shopping cart by www.zencart.com

The three methods I have tried are below:

The first was suggested by one of the carts programmers:

the jscript goes into my template folder as such cart/includes/templates/fleshmetal/jscripts/jscript_popupWindowSizeChart.js


?>
<script language="javascript" type="text/javascript"><!--
function popupWindowSizeChart('url') {
window.open('url','popupWindow',& #39;toolbar=no,location=no,directories=no,status=no,menubar=no,scrollb
ars=no,resizable=no,copyhistory=no,width=830,height=500,screenX=150,screenY=150,top=150,left=150')
}
//--></script>

The link is in cart/includes/modules/sideboxes/information.php


$information[] = '<a href="javascript:popupWindowSizeChart(\'' . zen_href_link("popup_sizechart") . '\')">popup Size Chart</a>';

This generates the following link:
javascript:popupWindowSizeChart('http://www.fleshmetal.com.au/popup_sizechart.html')

but clicking it produces nothing.

---

This next attempt is one I pieced together.

cart/includes/templates/fleshmetal/jscripts/jscript_popupjscript_openpopup.js


<script type="text/javascript">

function openpopup(www.fleshmetal.com.au/popup_sizechart.html){
var winpops=window.open(www.fleshmetal.com.au/popup_sizechart.html,"","width=750,height=450")
}
</script>

The link is as follows

$information[] = '<a href="javascript:openpopup(\'' . zen_href_link(popup_sizechart) . '\')">Size Chart</a>';

generates:
javascript:openpopup('http://www.fleshmetal.com.au/popup_sizechart.html')

But again nothing.

----

This is a very bloated one I got from a generator.

cart/includes/templates/fleshmetal/jscripts/jscript_popupSizeChart.js


<SCRIPT LANGUAGE='JAVASCRIPT' TYPE='TEXT/JAVASCRIPT'>
<!--
/**********************************************
JavaScript Popup function
By: DOMINIQUE PELADEAU
Url: http://www.1stoppopup.com
**********************************************/
var fenetre=null;
function GetFvpCookie(DPName){
var Fvpsearch = DPName + "="
var returnFvpValue = "";
if (document.cookie.length > 0){
fvpOffset = document.cookie.indexOf(Fvpsearch)
if (fvpOffset != -1) {
fvpOffset += Fvpsearch.length
fvpend = document.cookie.indexOf(";",fvpOffset);
if (fvpend == -1)
fvpend = document.cookie.length;
returnFvpValue=unescape(document.cookie.substring(fvpOffset, fvpend))
}
}
return returnFvpValue;
}
function popupSizeChart(mypopurl,mypopname,sizew,sizeh,poppos,auFoyer){
if(GetFvpCookie("poppedup")!=""){return;}
document.cookie="poppedup=yes";
if(poppos=="center"){magauche=(screen.width)?(screen.width-sizew)/2:100;monhaut=(screen.height)?(screen.height-sizeh)/2:100;}
else if((poppos!='center') || poppos==null){magauche=20+0;monhaut=20+0}
reglages="width=" + sizew + ",height=" + sizeh + ",top=" + monhaut + ",left=" + magauche + ",scrollbars=no,location=no,directories=no,status=no,menubar=no,toolbar=no,resizable=no";fenetre=window.open(mypopurl,mypopname,reglages);
fenetre.focus();}
// -->
</script>


$information[] = '<a href="javascript:popupSizeChart(\'' . zen_href_link(popup_sizechart) . '\','SizeChart','830','500','PosNums','front');">SizeChart</a>


But this simply gives a parse error on the page.

This (http://www.fleshmetal.com.au/popup_sizechart.html) is the page I am trying to popup.

I have been banging my head against this wall for three weeks now, I just dont understand how such a simply function can be so painfull.

_Aerospace_Eng_
05-24-2005, 07:40 AM
The first one was almost right

<script type="text/javascript">
<!--
function popupWindowSizeChart(url) {
window.open(url,'popupWindow','toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars =no,resizable=no,copyhistory=no,width=830,height=500,screenX=150,screenY=150,top=150,left=150')
}
//-->
</script>

Bill Posters
05-24-2005, 07:46 AM
Re: 1st example…




function popupWindowSizeChart('url') {
window.open('url','popupWindow',& #39;toolbar=no,location=no,directories=no,status=no,menubar=no,scrollb
ars=no,resizable=no,copyhistory=no,width=830,height=500,screenX=150,screenY=150,top=150,left=150')
}
//--></script>

Change two lines to the following:

function popupWindowSizeChart(url) {
window.open(url,…

Notice that the apostrophes/single-quotes have been removed from around the variables. By placing apostrophes/single-quotes or double quotes around a variable, you are declaring it as a string value, rather than simply citing the var name.
In those two positions, you need to cite the basic var name.

With those two changes, your first example should work fine.

ghostcorps
05-24-2005, 08:27 AM
WOW! that was fast!!

Thanks guys :) :)

Ok, so I can safely assume that I now have the correct code in /jscripts/jscript_SizeChart.js (I renamed the first example)




<script language="javascript" type="text/javascript"><!--
function SizeChart(url) {
window.open(url,'popupWindow',& #39;toolbar=no,location=no,directories=no,status=no,menubar=no,scrollb
ars=no,resizable=no,copyhistory=no,width=830,height=500,screenX=150,screenY=150,top=150,left=150')
}
//--></script>

Unfortunatly It seems the issue is bigger than one fix :( What could another cause of the error be?

FYI: My housemate suggested a require, which is apparently obvious, but then the guys at zencart said it was unnessecary as the cart outo detects when scripts are required.

=^_^=

glenngv
05-24-2005, 09:43 AM
<script language="javascript" type="text/javascript"><!--
function SizeChart(url) {
window.open(url,'popupWindow',& #39;toolbar=no,location=no,directories=no,status=no,menubar=no,scrollb
ars=no,resizable=no,copyhistory=no,width=830,height=500,screenX=150,screenY=150,top=150,left=150')
}
//--></script>
Change the red part to '

You may want to focus to the opened popup.


function popupWindowSizeChart(url) {
var w = window.open(url,'popupWindow','toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars =no,resizable=no,copyhistory=no,width=830,height=500,screenX=150,screenY=150,top=150,left=150')
w.focus();
}

ghostcorps
05-25-2005, 02:16 AM
Thank Glenn

[edit] After writting the below I just noticed the "w.focus();" Will add it now. [edit2] stil nope :(.

The apostrophe hasnt made any differance either. I will look into issues that may be caused by the page I am loading, but the thing is I know the page works See here (http://www.fleshmetal.com.au/popup_sizechart.html). Also the bloated script i showed came from a generator HERE (http://1stoppopup.com/pop1.htm) That has a preview function and the page worked fine there too. Be that as it may, I will focus there and see if I can trim anything out that would be causing problems.

----

I hav now cut the page scripts down to bare essentials, but still the problem persists.

The page is defined as follows:

cart/includes/modules/pages/sizechart/header_php.php

<?php
require(DIR_WS_MODULES . 'require_languages.php');
?>

cart/includes/languages/english/sizechart.php

<?php
define('HEADING_SIZECHART', '');
define('TEXT_SIZECHART_HELP1', '' . zen_image('images/sizechart.jpg'));
define('TEXT_CLOSE_SIZECHART_WINDOW', 'Close Window [x]');
?>

cart/includes/templates/fleshmetal/sizechart/

<?php
// $Id: tpl_main_page.php 277 2004-09-10 23:03:52Z wilt $
?>
<body>
<table width="400" border="0" cellpadding="2" cellspacing ="2" class="sizechart">
<tr>
<td class="pageHeading"><?php echo HEADING_SIZECHART ?></td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td class="main"><?php echo TEXT_SIZECHART_HELP1 ?></td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td class="main"><?php echo '<a href="javascript:window.close()">' . TEXT_CLOSE_SIZECHART_WINDOW . '</a>'; ?></td>
</tr>
</table>
</body>

... Thanks again guys.. I may not have the problem fixed, but every suggestion teaches me a little more :thumbsup:

nt. I have change the page name and class from popup_sizechart to simply 'sizechart'

ghostcorps
06-06-2005, 01:44 AM
sorry to bump, but I still canot get this to work... can anyone see with fresh eyes what I have deon wrong?

=^_^=

_Aerospace_Eng_
06-06-2005, 01:51 AM
Can you give us a link to your page please? I have a feeling that some of the window open properties are on more than one line.

ghostcorps
06-06-2005, 02:02 AM
thanks the site is www.fleshmetal.com.au the link is the one called Sizechart in the righthand sidebox.

below is the full script:


cart/includes/modules/pages/sizechart/header_php.php

<?php
require(DIR_WS_MODULES . 'require_languages.php');
?>

cart/includes/languages/english/sizechart.php

<?php
define('HEADING_SIZECHART', '');
define('TEXT_SIZECHART_HELP1', '' . zen_image('images/sizechart.jpg'));
define('TEXT_CLOSE_SIZECHART_WINDOW', 'Close Window [x]');
?>


cart/includes/templates/fleshmetal/sizechart/tpl_main_page.php

<?php
// $Id: tpl_main_page.php 277 2004-09-10 23:03:52Z wilt $
?>
<body>
<table width="400" border="0" cellpadding="2" cellspacing ="2" class="sizechart">
<tr>
<td class="pageHeading"><?php echo HEADING_SIZECHART ?></td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td class="main"><?php echo TEXT_SIZECHART_HELP1 ?></td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td> </td>
</tr>
<tr>
<td class="main"><?php echo '<a href="javascript:window.close()">' . TEXT_CLOSE_SIZECHART_WINDOW . '</a>'; ?></td>
</tr>
</table>
</body>


The physical link is found in cart/includes/modules/sideboxes/information.php


$information[] = '<a href="javascript:SizeChart(\'' . zen_href_link("sizechart") . '\')">Size Chart</a>';
It translates to
javascript:SizeChart('http://www.fleshmetal.com.au/index.php?main_page=sizechart


cart/includes/tamplates/custom/jscript/jscript_SizeChart.js

<?php
?>
<script language="javascript" type="text/javascript"><!--
function SizeChart(url) {
var w = window.open(url,'popupWindow','toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars =no,resizable=no,copyhistory=no,width=830,height=500,screenX=150,screenY=150,top=150,left=150')
w.focus();
}
//--></script>

glenngv
06-06-2005, 03:48 AM
Why do you access the function as SizeChart when the function name is popupWindowSizeChart?

ghostcorps
06-06-2005, 04:52 AM
LOL.. nice pickup... I changed the function name and forgot to change that one... unfortunatly it doesnt fix anythgin though :(

thanks though

glenngv
06-06-2005, 02:58 PM
Is your site updated? I checked out your link and it still seems to be not updated.

ghostcorps
06-07-2005, 02:04 AM
:o it is now... but still no luck .. thanks

devosc
06-07-2005, 02:32 AM
What browser are you using ? FireFox is quite informative about JavaScript errors.

Presumably the real errors where spotted above... however I just visited your site.

Error: syntax error
Source File: http://www.fleshmetal.com.au/includes/templates/fleshmetal/jscript/jscript_SizeChart.js
Line: 1
Source Code:
<?php



<?php
//
// +----------------------------------------------------------------------+
// |zen-cart Open Source E-commerce |
// +----------------------------------------------------------------------+
// | Copyright (c) 2004 The zen-cart developers |
// | |
// | http://www.zen-cart.com/index.php |
// | |
// | Portions Copyright (c) 2003 osCommerce |
// +----------------------------------------------------------------------+
// | This source file is subject to version 2.0 of the GPL license, |
// | that is bundled with this package in the file LICENSE, and is |
// | available through the world-wide-web at the following url: |
// | http://www.zen-cart.com/license/2_0.txt. |
// | If you did not receive a copy of the zen-cart license and are unable |
// | to obtain it through the world-wide-web, please send a note to |
// | license@zen-cart.com so we can mail you a copy immediately. |
// +----------------------------------------------------------------------+
// $Id: jscript_main.js DrByte $
//
?>
<script language="javascript" type="text/javascript"><!--
function SizeChart(url) {
var w = window.open(url,'popupWindow','toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars =no,resizable=no,copyhistory=no,width=830,height=500,screenX=150,screenY=150,top=150,left=150')
w.focus();
}
//--></script>


Error: syntax error
Source File: http://www.fleshmetal.com.au/includes/templates/fleshmetal/jscript/jscript_openpopup.js
Line: 1
Source Code:
<?php



<?php
//
// +----------------------------------------------------------------------+
// |zen-cart Open Source E-commerce |
// +----------------------------------------------------------------------+
// | Copyright (c) 2004 The zen-cart developers |
// | |
// | http://www.zen-cart.com/index.php |
// | |
// | Portions Copyright (c) 2003 osCommerce |
// +----------------------------------------------------------------------+
// | This source file is subject to version 2.0 of the GPL license, |
// | that is bundled with this package in the file LICENSE, and is |
// | available through the world-wide-web at the following url: |
// | http://www.zen-cart.com/license/2_0.txt. |
// | If you did not receive a copy of the zen-cart license and are unable |
// | to obtain it through the world-wide-web, please send a note to |
// | license@zen-cart.com so we can mail you a copy immediately. |
// +----------------------------------------------------------------------+
// $Id: jscript_main.js DrByte $
//
?>
<script type="text/javascript">

function openpopup(www.fleshmetal.com.au/popup_sizechart.html){
var winpops=window.open(www.fleshmetal.com.au/popup_sizechart.html,"","width=750,height=450")
}
</script>


Error: syntax error
Source File: http://www.fleshmetal.com.au/includes/templates/fleshmetal/jscript/jscript_popupSizeChart.js
Line: 1
Source Code:
<SCRIPT LANGUAGE='JAVASCRIPT' TYPE='TEXT/JAVASCRIPT'>



<SCRIPT LANGUAGE='JAVASCRIPT' TYPE='TEXT/JAVASCRIPT'>
<!--
/**********************************************
JavaScript Popup function
By: DOMINIQUE PELADEAU
Url: http://www.1stoppopup.com
**********************************************/
var fenetre=null;
function GetFvpCookie(DPName){
var Fvpsearch = DPName + "="
var returnFvpValue = "";
if (document.cookie.length > 0){
fvpOffset = document.cookie.indexOf(Fvpsearch)
if (fvpOffset != -1) {
fvpOffset += Fvpsearch.length
fvpend = document.cookie.indexOf(";",fvpOffset);
if (fvpend == -1)
fvpend = document.cookie.length;
returnFvpValue=unescape(document.cookie.substring(fvpOffset, fvpend))
}
}
return returnFvpValue;
}
function popupSizeChart(mypopurl,mypopname,sizew,sizeh,poppos,auFoyer){
if(GetFvpCookie("poppedup")!=""){return;}
document.cookie="poppedup=yes";
if(poppos=="center"){magauche=(screen.width)?(screen.width-sizew)/2:100;monhaut=(screen.height)?(screen.height-sizeh)/2:100;}
else if((poppos!='center') || poppos==null){magauche=20+0;monhaut=20+0}
reglages="width=" + sizew + ",height=" + sizeh + ",top=" + monhaut + ",left=" + magauche + ",scrollbars=no,location=no,directories=no,status=no,menubar=no,toolbar=no,resizable=no";fenetre=window.open(mypopurl,mypopname,reglages);
fenetre.focus();}
// -->
</script>



The problem with all three is that they are not being php included directly in the html document, i.e. something like <?php include('http://www.fleshmetal.com.au/includes/templates/fleshmetal/jscript/jscript_popupSizeChart.js'); ?>

The easiest thing to do for the first two would be just remove the zencart headers in those two javascript files (I'm pretty sure ZC won't mind due to the nature of what those files are, plus it seems that they are not exactly the original intended files also).
And for the third (actually all three) just remove the <script> and </scipt> tags.

glenngv
06-07-2005, 02:37 AM
You should not put <script> tags, HTML comments and php tags inside a .js file. If you would like to put copyright, enclose it in javascript comment /* comment here */ or //comment here

ghostcorps
06-07-2005, 04:51 AM
devosc: Thankyou!!!!!!!!! you have no idea how long I have been trying to figure this out... and of course it was so simple!!!!

glencv: thanks also you guys rock my casbah

*does a little dance*

=^_^=

glenngv
06-07-2005, 07:40 AM
glencv: thanks also you guys rock my casbah

I'm glenngv and not glencv. :D
Anyway, glad you finally made it worked. :)

I should have seen those script and php tags and html comments in your .js file earlier. I think they were already there when you started this thread.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum