Using <select><option>?</option></select> to display text.

[Steve_Berry]

I am trying to use a <select> <option> to display text on a web page.  The data comes from a database.

This is what I am attempting:  When an option is selected and submit button clicked them some text will be displayed.

At the moment I do have text on the web page, but none of the selected options change this.  I have four pieces of text: Page 1, Page 2 etc. At the moment Page 4 text is displayed.  I would like each piece of text to be displayed.

This is the php:

<?php
//  Connect to the database
    $pdo = new PDO("mysql:host=localhost;dbname=###", "###", "");
   
    $sql = "SELECT * FROM testdb ORDER BY id";
    try {
      $stmt = $pdo->prepare($sql);
      $stmt->execute();
      $data = $stmt->fetchAll();
    }
  catch(Exception $ex){
    echo ($ex -> getMessage());
  }

?>

This is the html:

<form name="###" method="post" action="#">
      <p></p>
      <select onchange="reload(this.form)">
        <option>test one</option>
        <?php foreach ($data as $output) { ?>
          <option value=''><?php echo $output['header']; ?></option>
      <?php  } ?>
      </select>
      <br>
      <button type="submit" value="submit">Submit</button>
    </form>

    <?php echo $output['pages']; ?>

I would appreciate help with this.  However, from previous attempts at adding data to a page I used isset() and I think $_POST(), possibly together.  If these are the things I need to use, then please could you include their usage within any examples you feel would help.  Thank you.

[Barand]

Put the echo inside the loop to list all of them otherwise you'll only list the last one.

You will need to restructure your code.

 

Edited September 3, 2021 by Barand

[Steve_Berry]

I have tried a few things, as a beginner I guessed what I needed to do.  The following code is what I have tried - not working obviously.  Am I on the right track.  If not I would appreciate an example.

Thanks.

<select onchange="reload(this.form)">
  <option>test one</option>
  	<option>
    	<?php foreach ($data as $output) {

     		echo $output['header'];

        } ?>
  </option>
</select>

 

[maxxd]

That's going to put all the header values in the same option. You need to create a new option element on each iteration of the loop.

[ginerjm]

Try this instead

$select_tag = "<select onchange='reload(this.form)'>";
$select_tag .= "<option>test one</option>";
foreach ($data as $output) 
{
	$select_tag .= "<option>" . $output['header'] . "</option>";
}
$select_tag .= "</select>";

Now - in your html area simply place the $select_tag var where you want this html to show up.

[Steve_Berry]

Hello, after some search, testing etc.  I found something online to help with what I have been trying to do. I displays the options fine, but I still don't get the required data to display.  For example, <option value="Page 1">Page 1</option> does not show Page 1 text.

I also have an if else statement where the else part does not appear to work - no message.

This is the code:

<div class="container">
    <form name="myForm" method="post" action="">
      <div class="select-block">
        <select name="Pages">
          <option value="" disabled selected>Testin 123</option>
          <option value="Page 1">Page 1</option>
          <option value="Page 2">Page 2</option>
          <option value="Page 3">Page 3</option>
          <option value="Page 4">Page 3</option>
        </select>
      </div>

      <input type="submit" name="submit" value="Submit">
    </form>

    <?php
      if(isset($_POST['myForm'])){
        if(!empty($_POST['Pages'])) {

          //Connect to the database
          $pdo = new PDO("mysql:host=localhost;dbname=timeline", "root", "");
          $sql = "SELECT * FROM testdb ORDER BY id";
          $stmt = $pdo->prepare($sql);
          $stmt->execute();
          $data = $stmt->fetchAll();
          echo $data['pages'];

        } else {
          echo 'Please select an option.';
        }
      }

    ?>
  </div>

Please, could you help with the code.   Thanks

[ginerjm]

Not sure what you are pointing out.  But - does that code display 'page 4'?

[Steve_Berry]

No.  No text is displayed.  There should be a message when the page loads.  When an option is chosen, and the submit button is clicked, there should be some text, but the page just resets.

i have attached an image of what I mean: initial page, options, and then submitted.

[ginerjm]

Well I was trying to point out that your option statements have an error in them and was wondering what DID show up on the screen.  Do you see the error for page4?

[Barand]

4 hours ago, Steve_Berry said:

there should be some text, but the page just resets.

That's because all you are doing is resetting the page

<select onchange="reload(this.form)">
  

You need to send the form data. Try...

<select name="page" onchange="this.form.submit()">
  

and change

8 hours ago, Steve_Berry said:

if(isset($_POST['myForm'])){

to

if ($_SERVER['REQUEST_METHOD']=='POST') {