Started playing with .php a couple weeks ago and found this problem in a book. I have 4 different buttons that will call different functions respectively but currently all 4 of my functions are called when I click individual buttons? Need a little help understanding this one. Everything is working fine except the call. With each button submit a different function should be called. I have the html separate from the php code. What I'm looking at is click a button and the function is called. Currently it is calling all functions at the same time.
HTML:
<?php
if (isset($_POST['Sequence1'])) {
echo Sequence1(); }
else if (isset($_POST['Sequence2'])) {
echo Sequence2(); }
else if (isset($_POST['Sequence3'])) {
echo Sequence3(); }
else if (isset($_POST['Sequence4'])) {
echo Sequence4(); }
?>
<!doctype html>
<html>
<head>
<title>Sequence Test</title>
<link rel="stylesheet" type="text/css" href="q2.css">
</head>
<body>
<form action="q2_process.php" method="post">
<div class="header">
<header><h1>Numeric Sequence Tester</h1></header>
</div>
<div class="prompt">
<h2>Click on a button below to see the sequence</h2>
</div>
<div class="button1">
<p><button type="submit" formmethod="post" name="Sequence1" value="Sequence1" class= "buttons">Sequence 10 - 2n</button></p>
</div>
<div class="button2">
<p><button type="submit" formmethod="post" name="Sequence2" value="Sequence2" class="buttons">Sequence 4n + 3</button></p>
</div>
<div class="button3">
<p><button type="submit" formmethod="post" name="Sequence3" value="Sequence3" class="buttons">Sequence n*n - 2</button></p>
</div>
<div class="button4">
<p><button type="submit" formmethod="post" name="Sequence4" value="Sequence4" class="buttons">Sequence ar^n; when a-4 r=3</button></p>
</div>
</form>
</body>
</html>
PHP Functions:
<?php
function Sequence1() {
$num = 0;
$result = 0;
for($i = 0; $i < 9; $i++) {
$num++;
$num1 = (2 * $num);
$result = 10 - $num1;
echo "When n=${num}; 10-2n = 10-2x $num1 = 10 - $num1 = $result <br>"; }} ?>
<?php function Sequence2() {
$num = 0;
$result = 0;
for($i = 0; $i < 9; $i++) {
$num++;
$num1 = (4 * $num);
$result = $num1 + 3;
echo "When n=${num}; 4n+3 = 4 x $num + 3 = $num1 + 3 = $result <br>"; }}; ?>
<?php function Sequence3() {
$num = 0;
$result = 0;
for($i = 0; $i < 9; $i++) {
$num++;
$num1 = ($num* $num);
$result = $num1 - 2;
echo "When n=${num}; n*n-2 = $num x $num - 2 = $num1 - 2 = $result <br>"; }}; ?>
<?php function Sequence4() {
$num = 0;
$result = 0;
for($i = 0; $i < 9; $i++) {
$a = 3;
$r = 2;
$num++;
$num1 = $a * pow($r, $num -1);
$result = $num1 * 2;
echo "When n=${num}; $num1 x 2 = $result <br>"; }} ?>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Sequence Tester</title>
<link rel="stylesheet" type="text/css" href="q2.css">
</head>
<body>
<div class="header">
<header><h1>Sequence Tester</h1></header>
</div>
<!--Create divs to hold each button click-->
<div class="seq1">
<h3>You selected button 1</h3>
<p><?php echo Sequence1(); ?></p>
</div>
<div class="seq2">
<h3>You selected button 2</h3>
<p><?php echo Sequence2(); ?></p>
</div>
<div class="seq3">
<h3>You selected button 3</h3>
<p><?php Sequence3(); ?></p>
</div>
<div class="seq4">
<h3>You selected button 4</h3>
<p><?php Sequence4(); ?></p>
</div>
<div class="home">
<a href="q2_index.html">Back to Homepage</a>
</div>
</body>
</html>
You are calling each function here:
<div class="seq1">
<h3>You selected button 1</h3>
<p><?php echo Sequence1(); ?></p>
</div>
<div class="seq2">
<h3>You selected button 2</h3>
<p><?php echo Sequence2(); ?></p>
</div>
<div class="seq3">
<h3>You selected button 3</h3>
<p><?php Sequence3(); ?></p>
</div>
<div class="seq4">
<h3>You selected button 4</h3>
<p><?php Sequence4(); ?></p>
</div>
And that's why it appears that all buttons are submitted.
Edited to answer your second question as to why the function is being output on top of the DOM:
The output on top of the DOM is coming because you are calling your php functions here:
if (!empty($_POST['Sequence1'])) {
$v = "button 1";
Sequence1(); }
else if (isset($_POST['Sequence2'])) {
$v = "button 2";
Sequence2(); }
else if (isset($_POST['Sequence3'])) {
$v = "button 3";
Sequence3(); }
else if (isset($_POST['Sequence4'])) {
$v = "button 4";
Sequence4(); ; }
Since each function is defined by you to 'echo' results instead of 'returning' them to a variable (see your function description), it is outputted near the top of the page when you call it in the if/else loop above.
Edited I made some changes to your function calls to 'return' the values instead and then display them in the correct div. Try this:
<?php
$v = '';
$j = '';
if (!empty($_POST['Sequence1'])) {
$v = "button 1";
$j = Sequence1(); }
else if (isset($_POST['Sequence2'])) {
$v = "button 2";
$j = Sequence2(); }
else if (isset($_POST['Sequence3'])) {
$v = "button 3";
$j = Sequence3(); }
else if (isset($_POST['Sequence4'])) {
$v = "button 4";
$j = Sequence4(); }
?>
<!doctype html>
<html>
<head>
<title>Sequence Test</title>
<link rel="stylesheet" type="text/css" href="q2.css">
</head>
<body>
<form action="" method="post">
<div class="header">
<header><h1>Numeric Sequence Tester</h1></header>
</div>
<div class="prompt">
<h2>Click on a button below to see the sequence</h2>
</div>
<div class="button1">
<p><button type="submit" formmethod="post" name="Sequence1" value="Sequence1" class= "buttons">Sequence 10 - 2n</button></p>
</div>
<div class="button2">
<p><button type="submit" formmethod="post" name="Sequence2" value="Sequence2" class="buttons">Sequence 4n + 3</button></p>
</div>
<div class="button3">
<p><button type="submit" formmethod="post" name="Sequence3" value="Sequence3" class="buttons">Sequence n*n - 2</button></p>
</div>
<div class="button4">
<p><button type="submit" formmethod="post" name="Sequence4" value="Sequence4" class="buttons">Sequence ar^n; when a-4 r=3</button></p>
</div>
</form>
</body>
</html>
PHP Functions:
<?php
function Sequence1()
{
$output = "";
$num = 0;
$result = 0;
for ($i = 0; $i < 9; $i++) {
$num++;
$num1 = (2 * $num);
$result = 10 - $num1;
$output .= "When n=${num}; 10-2n = 10-2x $num1 = 10 - $num1 = $result <br>";
}
return $output;
}
function Sequence2()
{
$output = "";
$num = 0;
$result = 0;
for ($i = 0; $i < 9; $i++) {
$num++;
$num1 = (4 * $num);
$result = $num1 + 3;
$output .= "When n=${num}; 4n+3 = 4 x $num + 3 = $num1 + 3 = $result <br>";
}
return $output;
}
function Sequence3()
{
$output = "";
$num = 0;
$result = 0;
for ($i = 0; $i < 9; $i++) {
$num++;
$num1 = ($num * $num);
$result = $num1 - 2;
$output .= "When n=${num}; n*n-2 = $num x $num - 2 = $num1 - 2 = $result <br>";
}
return $output;
}
function Sequence4() {
$output = "";
$num = 0;
$result = 0;
for($i = 0; $i < 9; $i++) {
$a = 3;
$r = 2;
$num++;
$num1 = $a * pow($r, $num -1);
$result = $num1 * 2;
$output .= "When n=${num}; $num1 x 2 = $result <br>";
}
return $output;
}
?>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Sequence Tester</title>
<link rel="stylesheet" type="text/css" href="q2.css">
</head>
<body>
<div class="header">
<header><h1>Sequence Tester</h1></header>
</div>
<!--Create divs to hold each button click-->
<div class="seq_result">
<h3>You selected <?php echo $v; ?></h3>
<p><?php echo $j; ?></p>
</div>
<div class="home">
<a href="q2_index.html">Back to Homepage</a>
</div>
</body>
</html>