error while passing input value to the next page

below is the original code, and

<html>
<head>
    <title>slider</title>
    <link rel="stylesheet" href="style.css">
</head>

<body>

    

    <div class="slider-container">
      <form action="asd.php" method="GET">
        <input type="range" min="0" max="10" value="5" id="slider">
      </form>
        <div id="selector">
          <div class="SelectBtn1"></div>
          <div id="SelectValue"></div>
        </div>
        <div id="Progressbar"></div>
    </div>
    
    <div class="nextcontainer">
      <a href="asd.php" class="result">Result &raquo;</a>
    </div>

JavaScript
​x
 
<html><head>    <title>slider</title>    <link rel="stylesheet" href="style.css"></head>​<body>​    ​    <div class="slider-container">      <form action="asd.php" method="GET">        <input type="range" min="0" max="10" value="5" id="slider">      </form>        <div id="selector">          <div class="SelectBtn1"></div>          <div id="SelectValue"></div>        </div>        <div id="Progressbar"></div>    </div>        <div class="nextcontainer">      <a href="asd.php" class="result">Result &raquo;</a>    </div>​ ​

the asd.php

<body>
  <div class="result-head">
    <h1 class="main-title ng-binding">Your excrement..</h1>
  </div>

  <div class="result-container">
    <h1 class="area">can support annually<?php echo $_REQUEST['slider'];?></h1>
  </div>
</body>

JavaScript
 
<body>  <div class="result-head">    <h1 class="main-title ng-binding">Your excrement..</h1>  </div>​  <div class="result-container">    <h1 class="area">can support annually<?php echo $_REQUEST['slider'];?></h1>  </div></body>​

I made html file and php file, and I tried to get response from the survey and try to show it in the next page(asd.php)

However, when I input and surf the next page, it shows pure code like the picture. What did I do wrong?

Answer

You have to use the attribute name instead of the attribute id because that is how it is passed on. For example you could do

<html>
<head>
    <title>slider</title>
    <link rel="stylesheet" href="style.css">
</head>

<body>

    

    <div class="slider-container">
      <form action="asd.php" method="GET">
        <input type="range" min="0" max="10" value="5" id="slider" name="slider">
      </form>
        <div id="selector">
          <div class="SelectBtn1"></div>
          <div id="SelectValue"></div>
        </div>
        <div id="Progressbar"></div>
    </div>
    
    <div class="nextcontainer">
      <a href="asd.php" class="result">Result &raquo;</a>
    </div>

JavaScript
 
<html><head>    <title>slider</title>    <link rel="stylesheet" href="style.css"></head>​<body>​    ​    <div class="slider-container">      <form action="asd.php" method="GET">        <input type="range" min="0" max="10" value="5" id="slider" name="slider">      </form>        <div id="selector">          <div class="SelectBtn1"></div>          <div id="SelectValue"></div>        </div>        <div id="Progressbar"></div>    </div>        <div class="nextcontainer">      <a href="asd.php" class="result">Result &raquo;</a>    </div>​

Advertisement

Answer