Solved

having multiple buttons on a modal window, which execute different scripts

Posted on 2008-10-22
6
651 Views
Last Modified: 2008-11-11
Hi experts, I have the attached page code as the code which fills in a modal window on one of my pages.  The page that it originates from has this javascript within it:

function ModalExec1(modalVal) {

if (modalVal=1) {  
window.location = "./BasicModalTest3_script_1.php";
}
if (modalVal=2) {  
window.location = "./BasicModalTest3_script_2.php";
}

}


What should happen is that if the modalVal variable is passed back to the main page, then it loads a new page (in my case, a script).  What I want is for each button to send a different value of modalVal back to the main page, so that the IF statements can decide which script to load.  At the minute, it always loads script_2, apart from when I simply close the modal... so not sure I'm passing the variable correctly (or if I can do this at all) and am unsure why the script is running when it's embedded in an IF statement...

Please help!!
<?php
include './infolink.php';
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 
 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" /><style type="text/css">
<!--
body {
	background-color: #FFFFFF;
}
 
.text {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	}
 
.echo {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #027ac6;
	font-style: italic;
}
.style1 {
	font-size: 24px;
	font-family: Arial, Helvetica, sans-serif;
	color: #027ac6;
}
 
	
-->
</style><title>modal test</title>
<script>
var modalVal=0;
</script>
</head>
<body>
<p><?php echo $_SESSION['modal_text_1']; ?></p>
<p>&nbsp;</p>
<button onclick="window.top.hidePopWin(true);modalVal.value=1">Make something happen</button>
<button onclick="window.top.hidePopWin(true);modalVal.value=2">Second happening</button>
  <button onclick="window.top.hidePopWin()">close this modal</button>
<p>&nbsp;</p>
</body>
</html>

Open in new window

0
Comment
Question by:RowdyBurns
  • 3
  • 3
6 Comments
 
LVL 1

Expert Comment

by:nick_bal
ID: 22782938
First of all use
<button onclick="ModalExec1('1')">
<button onclick="ModalExec1('2')">

and in the function use double = (==) instead of single (=)
function ModalExec1(modalVal) {
if (modalVal==1) {  
window.location = "./BasicModalTest3_script_1.php";
}
if (modalVal==2) {  
window.location = "./BasicModalTest3_script_2.php";
}

}
 
0
 

Author Comment

by:RowdyBurns
ID: 22784878
nick,  I've changed the IF statements to == as suggested.  I've played around with the onclick thing though, with no luck.  currently it looks like:

<button onclick="ModalExec1('1');window.top.hidePopWin(true)">Make something happen</button>
<button onclick="ModalExec1('2');window.top.hidePopWin(true)">Second happening</button>


This creates an error and doesn't close the modal.  If I swap the hidepopwin statement to first position, the window closes but the IF statement doesnt respond.  So I'm not sure this is setting the modalVal variable correctly....
0
 
LVL 1

Expert Comment

by:nick_bal
ID: 22786814
I am not sure i understand. Are you saying that you want to close a popup window and then redirect parent window to another location? Is this correct? Because what i sent you redirects the parent window to another location based upon the parameter in ModelExec function.
0
Announcing the Most Valuable Experts of 2016

MVEs are more concerned with the satisfaction of those they help than with the considerable points they can earn. They are the types of people you feel privileged to call colleagues. Join us in honoring this amazing group of Experts.

 

Author Comment

by:RowdyBurns
ID: 22802309
That's what I want to do I think - if the value sent from the Modal is '1' then the IF statement in the parent page redirects to script_1 and if the value sent is '2' then the IF statement redirects to script_2.  The value needs to be sent with the onclick, so that the value is decided by which button is clicked.
0
 
LVL 1

Expert Comment

by:nick_bal
ID: 22805949
Ok.. you can add the second function inside the ModalExec1 function.
<button onclick="ModalExec1('1')">
<button onclick="ModalExec1('2')">
 
function ModalExec1(modalVal) {
window.top.hidePopWin(true);
if (modalVal==1) {
window.location = "./BasicModalTest3_script_1.php";
}
if (modalVal==2) { 
window.location = "./BasicModalTest3_script_2.php";
}
 
}
 

Open in new window

0
 

Accepted Solution

by:
RowdyBurns earned 0 total points
ID: 22807081
That's not working either... Internet Explorer give me the 'error on page' message, and the modal doesn't close.  I have attached the two pages - the parent page followed by the modal - separated by *'s, so you can see what I've got as we speak.

Matt
<?php
include './infolink.php';
$_SESSION['modal_text_1']="This is the text we want displayed";
?>
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="./js/subModal-1/subModal.css" />
    <script type="text/javascript" src="./js/subModal-1/common.js"></script>
    <script type="text/javascript" src="./js/subModal-1/subModal.js"></script>
<!--
 
 
 
 
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}
//-->
 
 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" /><style type="text/css">
<!--
body {
	background-color: #FFFFFF;
}
 
.text {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	}
 
.echo {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #027ac6;
	font-style: italic;
}
.style1 {
	font-size: 24px;
	font-family: Arial, Helvetica, sans-serif;
	color: #027ac6;
}
 
	
-->
</style><title>Challenge Check</title>
<script type="text/JavaScript">
<!--
function MM_callJS(jsStr) { //v2.0
  return eval(jsStr)
}
//-->
 
function ModalExec1(modalVal) {
window.top.hidePopWin(true);
if (modalVal==1) {
window.location = "./BasicModalTest3_script_1.php";
}
if (modalVal==2) { 
window.location = "./BasicModalTest3_script_2.php";
}
 
}
 
 
 
 
</script>
</head>
<body>
<p>Push this button: <input name="b2" type="button" onclick="MM_callJS('showPopWin(\'./BasicModalTest3_modal.php\', 200, 200, ModalExec1);')" value="Open" /></p>
<p>&nbsp;</p>
<p>&nbsp;</p>
</body>
</html>
 
 
 
************************************************************************************************************************************************
 
<?php
include './infolink.php';
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 
 
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" /><style type="text/css">
<!--
body {
	background-color: #FFFFFF;
}
 
.text {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	}
 
.echo {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #027ac6;
	font-style: italic;
}
.style1 {
	font-size: 24px;
	font-family: Arial, Helvetica, sans-serif;
	color: #027ac6;
}
 
	
-->
</style><title>modal test</title>
 
</head>
<body>
<p><?php echo $_SESSION['modal_text_1']; ?></p>
<p>&nbsp;</p>
<button onclick="ModalExec1('1')">Make something happen</button>
<button onclick="ModalExec1('2')">Second happening</button>
  <button onclick="window.top.hidePopWin()">close this modal</button>
<p>&nbsp;</p>
</body>
</html>

Open in new window

0

Featured Post

Live: Real-Time Solutions, Start Here

Receive instant 1:1 support from technology experts, using our real-time conversation and whiteboard interface. Your first 5 minutes are always free.

Question has a verified solution.

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

Introduction HTML checkboxes provide the perfect way for a web developer to receive client input when the client's options might be none, one or many.  But the PHP code for processing the checkboxes can be confusing at first.  What if a checkbox is…
In Part 1 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7849-Hex-Maze.html) we covered the hexagonal maze basics -- how the cells are represented in a JavaScript array and how the maze is displayed.  In this part, we'…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

808 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