I have a form on CSS + part that sends data from text fields to the server-located file data.txt
Whenever I click on "submit" button, nothing goes on. I see this as a clear problem with a calling a PHP script
if(isset($_POST['textdata']))
{
$data=$_POST['textdata'];
$fp = fopen('data.txt', 'a');
fwrite($fp, $data);
fclose($fp);
}
?>
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<title>Pure CSS Steps</title>
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<header>
<h1>Pure <strong>CSS</strong> Steps</h1>
<p>... a sassy "Step By Step" process.</p>
</header>
<section>
<article>
<form method="post" class="pure-steps" >
<input type="radio" name="steps" class="pure-steps_radio" id="step-0" checked="">
<input type="radio" name="steps" class="pure-steps_radio" id="step-1">
<input type="radio" name="steps" class="pure-steps_radio" id="step-2">
<div class="pure-steps_group">
<ol>
<li class="pure-steps_group-step">
<header>
<h2 class="pure-steps_group-step_legend">Welcome</h2>
<p class="pure-steps_group-step_item">You are about to form the form.</p>
<p class="pure-steps_group-step_item"></p>
</header>
</li>
<li class="pure-steps_group-step">
<fieldset>
<legend class="pure-steps_group-step_legend">Grab a tour</legend>
<p class="pure-steps_group-step_item flexy-item flexy-column reverse">
<input name="textdata" type="text" placeholder="Type your email here" value="" id="input_email" >
<label for="input_email">Email</label>
</p>
<p class="pure-steps_group-step_item flexy-item flexy-column reverse">
<input type="text" placeholder="Type your nick here" value="" id="input_nick">
<label for="input_nick">Name</label>
</p>
<p class="pure-steps_group-step_item flexy-item flexy-column reverse">
<input type="text" placeholder="Type your nick here" value="" id="input_nick">
<label for="input_nick">Phone</label>
</p>
</fieldset>
</li>
<li class="pure-steps_group-step flexy-item">
<div class="pure-steps_preload">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 32 32" style="enable-background:new 0 0 32 32;" xml:space="preserve">
<path d="M31.8,3.6c-0.2-0.5-0.4-0.9-0.9-1.2C30.4,2,29.7,1.8,29,1.9c-0.6,0.1-1.2,0.4-1.6,1l-8.5,11.2l0,0l-7.2,9.5l-7.1-9.4 c-0.5-0.7-1.3-1-2.1-1c-0.5,0-1,0.2-1.4,0.5c-0.5,0.4-0.9,1-1,1.7s0.1,1.2,0.5,1.8l9.1,12.1l0,0c0.1,0.2,0.3,0.3,0.4,0.4 c0.4,0.3,0.9,0.5,1.4,0.5c0.8,0,1.6-0.3,2.1-1L22.1,18l0,0l9.1-12.1C32,5.2,32.1,4.4,31.8,3.6z"></path>
</svg>
</div>
</li>
</ol>
<ol class="pure-steps_group-triggers">
<li class="pure-steps_group-triggers_item">
<label for="step-0">Restart</label>
</li>
<li class="pure-steps_group-triggers_item">
<label for="step-1">Grab a tour</label>
</li>
<input type="submit" name="submit">
<li class="pure-steps_group-triggers_item">
<label type="submit" name="submit" for="step-2">Jump in</label>
</li>
</ol>
</div>
<br>
<label for="step-0">Restart</label>
</form>
</article>
</section>
</body>
</html>
The file is in the place. What seems to be the problem here? I see this as a problem with calling a PHP – there is no place to call it. Any suggestions where is the problem located?
PHP isn't client side and executes once on every request.
You could make the form point to itself which will make the page reload but this time with $_POST data.
<form method="post" class="pure-steps" action="thisPage.php" >