Solved

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

Posted on 2008-10-22
6
652 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
Free Tool: Postgres Monitoring System

A PHP and Perl based system to collect and display usage statistics from PostgreSQL databases.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

 

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

Networking for the Cloud Era

Join Microsoft and Riverbed for a discussion and demonstration of enhancements to SteelConnect:
-One-click orchestration and cloud connectivity in Azure environments
-Tight integration of SD-WAN and WAN optimization capabilities
-Scalability and resiliency equal to a data center

Question has a verified solution.

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

Suggested Solutions

The task A number given should be formatted for easy reading by separating digits into triads. Format must be made inline via JavaScript, i.e., frameworks / functions are not welcome. So let’s take a number like this “12345678.91¿ and format i…
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
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…

821 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