questor
05-19-2004, 08:02 AM
I'm writing a page that uses javascript and php. I need to pass data between them without changing pages. How can I do that?
Specifically, I need to pass the 'choice' var into the php script so that I can write the sql query WHERE id = X, and X will equal the choice variable.
Here's my page:
<html>
<head>
<title>COG</title>
<link rel="stylesheet" type="text/css" href="main.css">
<script>
function show(i)
{
var k = document.getElementById(i);
k.style.visibility = "visible";
}
function hide(i)
{
var k = document.getElementById(i);
k.style.visibility = "hidden";
}
function secondMenu(choice)
{
if (choice=="ops")
{
var choiceName = "Operations"
var notChoice1 = "net"
var notChoice1Name = "Network"
var notChoice2 = "ecomm"
var notChoice2Name = "Ecommerce"
var notChoice3 = "brc"
var notChoice3Name = "BRC"
}
if (choice=="net")
{
var choiceName = "Network"
var notChoice1 = "ops"
var notChoice1Name = "Operations"
var notChoice2 = "ecomm"
var notChoice2Name = "Ecommerce"
var notChoice3 = "brc"
var notChoice3Name = "BRC"
}
if (choice=="ecom")
{
var choiceName = "Ecommerce"
var notChoice1 = "net"
var notChoice1Name = "Network"
var notChoice2 = "ops"
var notChoice2Name = "Operations"
var notChoice3 = "brc"
var notChoice3Name = "BRC"
}
if (choice=="brc")
{
var choiceName = "BRC"
var notChoice1 = "net"
var notChoice1Name = "Network"
var notChoice2 = "ecomm"
var notChoice2Name = "Ecommerce"
var notChoice3 = "ops"
var notChoice3Name = "Operations"
}
document.forms['new_ticket'].dept.options[0] = new Option(choiceName,choice);
document.forms['new_ticket'].dept.options[1] = new Option(notChoice1Name,notChoice1);
document.forms['new_ticket'].dept.options[2] = new Option(notChoice2Name,notChoice2);
document.forms['new_ticket'].dept.options[3] = new Option(notChoice3Name,notChoice3);
show('secondary_menu');
}
</script>
</head>
<body>
<div id="main_menu">
<div><h2>Menu One</h2></div>
<div style="cursor:hand" onmouseover="this.style.backgroundColor='#330000';" onmouseout="this.style.backgroundColor=''" onclick="secondMenu('ops');">Operations</div>
<div style="cursor:hand" onmouseover="this.style.backgroundColor='#330000';" onmouseout="this.style.backgroundColor=''" onclick="secondMenu('net');">Network</div>
<div style="cursor:hand" onmouseover="this.style.backgroundColor='#330000';" onmouseout="this.style.backgroundColor=''" onclick="secondMenu('ecom');">Ecommerce</div>
<div style="cursor:hand" onmouseover="this.style.backgroundColor='#330000';" onmouseout="this.style.backgroundColor=''" onclick="secondMenu('brc');">BRC</div>
</div>
<div id="secondary_menu">
<div><h2>Menu Two</h2></div>
<div style="cursor:hand" onmouseover="this.style.backgroundColor='#330000';" onmouseout="this.style.backgroundColor=''" onclick="show('add_ticket');hide('edit_ticket');hide('edit_fyi');hide('view_report');">Add Ticket</div>
<div style="cursor:hand" onmouseover="this.style.backgroundColor='#330000';" onmouseout="this.style.backgroundColor=''" onclick="hide('add_ticket');show('edit_ticket');hide('edit_fyi');hide('view_report');">Edit Ticket</div>
<div style="cursor:hand" onmouseover="this.style.backgroundColor='#330000';" onmouseout="this.style.backgroundColor=''" onclick="hide('add_ticket');hide('edit_ticket');show('edit_fyi');hide('view_report');">Edit FYI</div>
<div style="cursor:hand" onmouseover="this.style.backgroundColor='#330000';" onmouseout="this.style.backgroundColor=''" onclick="hide('add_ticket');hide('edit_ticket');hide('edit_fyi');show('view_report');">View Report</div>
</div>
<div id="add_ticket">
<div><h2>Add A Ticket</h2></div>
<form name="new_ticket" action="add_ticket.php" method="post">
<div>Ticket Number:<br><input type="text" name="ticket_number" size=7></div>
<div>Severity:<br><select name="sev" size=1>
<option value="5">5</option>
<option value="4">4</option>
<option value="3">3</option>
<option value="2">2</option>
<option value="1">1</option>
<option value="C">Critical</option>
</select></div>
<div>Description:<br><textarea name="task" rows=3 cols=50></textarea></div>
<div>Deptartment:<br><select name="dept" size=1>
</select></div>
<div><br><input type="submit" value="Add Ticket"></div>
</form>
</div>
<div id="edit_ticket">
</div>
<div id="edit_fyi">
<div><h2>Edit the FYI</h2></div>
<form name="edit_fyi" action="edit_fyi.php" method="post">
<textarea name="fyi" rows=3 cols=50>
<?
$connect = mysql_connect("localhost","webuser","ecomm");
mysql_select_db("cog");
$result = mysql_query("SELECT text FROM fyi WHERE id=1");
$text = mysql_result($result,0);
echo $text;
mysql_close();
?>
</textarea>
<div><br><input type="submit" value="Update FYI"></div>
</form>
</div>
<div id="view_report">
</div>
</body>
</html>
Specifically, I need to pass the 'choice' var into the php script so that I can write the sql query WHERE id = X, and X will equal the choice variable.
Here's my page:
<html>
<head>
<title>COG</title>
<link rel="stylesheet" type="text/css" href="main.css">
<script>
function show(i)
{
var k = document.getElementById(i);
k.style.visibility = "visible";
}
function hide(i)
{
var k = document.getElementById(i);
k.style.visibility = "hidden";
}
function secondMenu(choice)
{
if (choice=="ops")
{
var choiceName = "Operations"
var notChoice1 = "net"
var notChoice1Name = "Network"
var notChoice2 = "ecomm"
var notChoice2Name = "Ecommerce"
var notChoice3 = "brc"
var notChoice3Name = "BRC"
}
if (choice=="net")
{
var choiceName = "Network"
var notChoice1 = "ops"
var notChoice1Name = "Operations"
var notChoice2 = "ecomm"
var notChoice2Name = "Ecommerce"
var notChoice3 = "brc"
var notChoice3Name = "BRC"
}
if (choice=="ecom")
{
var choiceName = "Ecommerce"
var notChoice1 = "net"
var notChoice1Name = "Network"
var notChoice2 = "ops"
var notChoice2Name = "Operations"
var notChoice3 = "brc"
var notChoice3Name = "BRC"
}
if (choice=="brc")
{
var choiceName = "BRC"
var notChoice1 = "net"
var notChoice1Name = "Network"
var notChoice2 = "ecomm"
var notChoice2Name = "Ecommerce"
var notChoice3 = "ops"
var notChoice3Name = "Operations"
}
document.forms['new_ticket'].dept.options[0] = new Option(choiceName,choice);
document.forms['new_ticket'].dept.options[1] = new Option(notChoice1Name,notChoice1);
document.forms['new_ticket'].dept.options[2] = new Option(notChoice2Name,notChoice2);
document.forms['new_ticket'].dept.options[3] = new Option(notChoice3Name,notChoice3);
show('secondary_menu');
}
</script>
</head>
<body>
<div id="main_menu">
<div><h2>Menu One</h2></div>
<div style="cursor:hand" onmouseover="this.style.backgroundColor='#330000';" onmouseout="this.style.backgroundColor=''" onclick="secondMenu('ops');">Operations</div>
<div style="cursor:hand" onmouseover="this.style.backgroundColor='#330000';" onmouseout="this.style.backgroundColor=''" onclick="secondMenu('net');">Network</div>
<div style="cursor:hand" onmouseover="this.style.backgroundColor='#330000';" onmouseout="this.style.backgroundColor=''" onclick="secondMenu('ecom');">Ecommerce</div>
<div style="cursor:hand" onmouseover="this.style.backgroundColor='#330000';" onmouseout="this.style.backgroundColor=''" onclick="secondMenu('brc');">BRC</div>
</div>
<div id="secondary_menu">
<div><h2>Menu Two</h2></div>
<div style="cursor:hand" onmouseover="this.style.backgroundColor='#330000';" onmouseout="this.style.backgroundColor=''" onclick="show('add_ticket');hide('edit_ticket');hide('edit_fyi');hide('view_report');">Add Ticket</div>
<div style="cursor:hand" onmouseover="this.style.backgroundColor='#330000';" onmouseout="this.style.backgroundColor=''" onclick="hide('add_ticket');show('edit_ticket');hide('edit_fyi');hide('view_report');">Edit Ticket</div>
<div style="cursor:hand" onmouseover="this.style.backgroundColor='#330000';" onmouseout="this.style.backgroundColor=''" onclick="hide('add_ticket');hide('edit_ticket');show('edit_fyi');hide('view_report');">Edit FYI</div>
<div style="cursor:hand" onmouseover="this.style.backgroundColor='#330000';" onmouseout="this.style.backgroundColor=''" onclick="hide('add_ticket');hide('edit_ticket');hide('edit_fyi');show('view_report');">View Report</div>
</div>
<div id="add_ticket">
<div><h2>Add A Ticket</h2></div>
<form name="new_ticket" action="add_ticket.php" method="post">
<div>Ticket Number:<br><input type="text" name="ticket_number" size=7></div>
<div>Severity:<br><select name="sev" size=1>
<option value="5">5</option>
<option value="4">4</option>
<option value="3">3</option>
<option value="2">2</option>
<option value="1">1</option>
<option value="C">Critical</option>
</select></div>
<div>Description:<br><textarea name="task" rows=3 cols=50></textarea></div>
<div>Deptartment:<br><select name="dept" size=1>
</select></div>
<div><br><input type="submit" value="Add Ticket"></div>
</form>
</div>
<div id="edit_ticket">
</div>
<div id="edit_fyi">
<div><h2>Edit the FYI</h2></div>
<form name="edit_fyi" action="edit_fyi.php" method="post">
<textarea name="fyi" rows=3 cols=50>
<?
$connect = mysql_connect("localhost","webuser","ecomm");
mysql_select_db("cog");
$result = mysql_query("SELECT text FROM fyi WHERE id=1");
$text = mysql_result($result,0);
echo $text;
mysql_close();
?>
</textarea>
<div><br><input type="submit" value="Update FYI"></div>
</form>
</div>
<div id="view_report">
</div>
</body>
</html>