How to display text on dropdown select

Question

I'm trying to do something very simple in PHP, but keep getting an error message. Essentially, when someone selects "Cat", I want "Miaow" to appear.

My idea was:

<select name="demo">
  <option value="Dog">Dog</option>
  <option value="Cat">Cat</option>
  <option value="Fish">Fish</option>
</select>

<?php if ($_POST['demo'] == 'Cat') { echo 'Miaow'; } ?>

However, in PHPFiddle,

I get 'E_NOTICE : type 8 -- Undefined index...'

as soon as the code runs. Am I missing something basic? Thanks!

Possible duplicate of [PHP: "Notice: Undefined variable" and "Notice: Undefined index"](http://stackoverflow.com/questions/4261133/php-notice-undefined-variable-and-notice-undefined-index) — Gerald Schneider, Jan 08 '16 at 12:50
Definitely not a duplicate of that post: I'd like to find out how to make this work, not simply remove the E_notice thanks... — JohnG, Jan 08 '16 at 12:56
You are getting this error because you are trying to access `$_POST['demo']` when the page first loads while it has not yet been initialized. Use `isset()` to check if its there before trying to compare it — Ahs N, Jan 08 '16 at 13:19

Florian Lemaitre · Answer 1 · 2016-01-08T13:16:23.307

1

Your form might be passing data by $_GET instead of $_POST. Did you specify the method ?

<form method="post" action="index.php">
    <select name="demo">
      <option value="Dog">Dog</option>
      <option value="Cat">Cat</option>
      <option value="Fish">Fish</option>
    </select>
    <input type="submit" value="Submit">
</form>

You can var_dump($_POST); and var_dump($_GET); to see what those variables contains in your PHP file.

Or you can do it in javascript like this :

function animal(value) {
  if(value == "Cat") {
    document.getElementById("myAnimal").innerHTML = "Miaouw";
  } else {
    document.getElementById("myAnimal").innerHTML = "Rooooah";
  }
}

<form action="#">
    <select name="demo" onchange="animal(this.value)">
        <option value="Dog">Dog</option>
        <option value="Cat">Cat</option>
        <option value="Fish">Fish</option>
    </select>
</form>
<span id="myAnimal"></span>

edited Jan 08 '16 at 13:16

answered Jan 08 '16 at 12:52

Florian Lemaitre

5,905
2
21
44

I did - I've alternated between POST and GET... Is it even possible to do this using PHP so that "Miaow" comes up automatically on select, rather than having to submit the form? – JohnG Jan 08 '16 at 12:57
If you want to do it without submitting the form you should then do it via simple javascript code or send an AJAX request via javascript. – Florian Lemaitre Jan 08 '16 at 13:06
And what if the fish makes a noise? Too many ifs. Don't need to repeat yourself. See my answer. – rybo111 Jan 08 '16 at 19:42

score 0 · Answer 2 · edited Jan 09 '16 at 16:28

0

Maybe this will help, I write some block as far as I understand...

  <form action="#" method="post">
    <select name="demo">
          <option value="Dog">Dog</option>
          <option value="Cat">Cat</option>
          <option value="Fish">Fish</option>
    </select>
    <input type="submit" name="sub" />
</form>
<?php 
    if(isset($_POST['sub'])){
        if($_POST['demo'] == "cat"){
            echo "Miao";
        }
    }
?>

edited Jan 09 '16 at 16:28

tiny sunlight

6,231
3
21
42

answered Jan 08 '16 at 13:06

RyhanRakib

1
2

the person who put a minus marking, can you please explain what i miss ?? maybe your explain can help me to learn something new. thank you. – RyhanRakib Jan 08 '16 at 13:29
$var = "str" will set $var, comparision should be done using == in this scenario – Mark Ng Jan 08 '16 at 15:09

score 0 · Answer 3 · answered Jan 08 '16 at 13:18

Is it even possible to do this using PHP so that "Miaow" comes up automatically on select, rather than having to submit the form?

You are looking for JavaScript code, not PHP. Here is a jQuery example:

$(document).on('change', '.animals', function(){
  $('.noise-target').html( $('option:selected', this).data('noise') );
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select class="animals">
  <option>Select</option>
  <option data-noise="Woof">Dog</option>
  <option data-noise="Meow">Cat</option>
</select>
<div class="noise-target"></div>

How to display text on dropdown select

3 Answers3