PHP Using value of radio button

Question

I'm trying to create a registration page where one person can register him/herself along with several other people or just register other people NOT including him/herself. So i've created 2 radio buttons for those options but i need to use the value of the radio button they select to display specific data. This is my code so far

<form name="selectnum" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>" method="post" >
<input type="radio" name="people" value="1"/> I'm attending <br/>
<input type="radio" name="people" value="2"/> I'm not attending <br/>
</form>

<?php if($_POST["people"]==1) { ?>
    How many, counting yourself, are you registering:
    <select name="num_a">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="8">8</option>
    <option value="9">9</option>
    <option value="10">10</option>
    <option value="11">11</option>
    <option value="12">12</option>
    <option value="13">13</option>
    <option value="14">14</option>
    <option value="15">15</option>
    <option value="16">16</option>
    <option value="17">17</option>
    <option value="18">18</option>
    <option value="19">19</option>
    <option value="20">20</option>
    </select>
<?php } elseif($_POST["people"]==2) { ?>
    How many, NOT counting yourself, are you registering:
    <select name="num_a">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
    <option value="5">5</option>
    <option value="6">6</option>
    <option value="7">7</option>
    <option value="8">8</option>
    <option value="9">9</option>
    <option value="10">10</option>
    <option value="11">11</option>
    <option value="12">12</option>
    <option value="13">13</option>
    <option value="14">14</option>
    <option value="15">15</option>
    <option value="16">16</option>
    <option value="17">17</option>
    <option value="18">18</option>
    <option value="19">19</option>
    <option value="20">20</option>
    </select>
<?php } ?>

But I realized that there needs to be a submit button for the values of the radios buttons to get saved in the $_POST array. So instead of using the post data, how do I check to see which radio button the user has selected and display the appropriate question after? Thank you

Um, could you please explain why it isn't possible for the selects to be in the form? Don't get that point really, sorry. — dbf
– dbf, Commented Sep 9, 2012 at 22:23
@dbf because nothing after the radio buttons display until after they user selects one of the two choices. Then the drop down list appears with the appropriate wording (counting yourself/not counting yourself) — Richard
– Richard, Commented Sep 9, 2012 at 22:32
Ok, and you do need the given option selected by the user (the question after) and be send with the form right? In other words, I'm not attending the college, then the question after appears and I select at option 2, 14 others ARE attending EXCLUDING me, then the submit button appears and I can send the form, correct? — dbf
– dbf, Commented Sep 9, 2012 at 22:40
Are you using any javascript frameworks, like jquery? would help to make the functionality more cross-browser compatible then pure javascript — dbf
– dbf, Commented Sep 9, 2012 at 23:05

dbf · Accepted Answer · 2012-09-09 23:19:38Z

1

It's not really the purpose to write someone's code, I know, but this might give you in extend, some idea why javascript is the best solution, and why PHP can't solve this. PHP is a server-side script, and can't solve problems on the client-side, whereas javascript can ;) You might try solving it with PHP, which will make it very ambiguous and javascript very sad .. :D

Try this code, save your old one, and play with it, it might just be what you like

<script type="text/javascript">
  function changedPeople(radio) {
    switch(radio.value) {
      case '1':
        document.getElementById('people1').style.display = "block";
        document.getElementById('people2').style.display = "none";
        break;
      case '2':
        document.getElementById('people1').style.display = "none";
        document.getElementById('people2').style.display = "block";
        break;

    }
    document.getElementById('submitter').style.display = "block";
  }
</script>

<form name="selectnum" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>" method="post" >
  <input type="radio" name="people" value="1" onchange="javascript:changedPeople(this);"/> I'm attending <br/>
  <input type="radio" name="people" value="2" onchange="javascript:changedPeople(this);"/> I'm not attending <br/>

  <div id="people1" style="display:none;">
    How many, counting yourself, are you registering:
    <select id="people1_select" name="num_a">
    <?php for($i=1;$i<=20;$i++) { ?>
      <option value="<?php echo $i ?>"><?php echo $i ?></option>
    <?php } ?>
    </select>
  </div>

  <div id="people2" style="display:none;">
    How many, NOT counting yourself, are you registering:
    <select id="people1_select" name="num_b">
    <?php for($i=1;$i<=20;$i++) { ?>
      <option value="<?php echo $i ?>"><?php echo $i ?></option>
    <?php } ?>
    </select>
  </div>

  <input type="submit" value="submit" id="submitter" style="display:none;" />
</form>

(Note that the javascript part would have been easier solved if you were using any kind of javascript framework like jquery or prototype)

edited Sep 9, 2012 at 23:19

answered Sep 9, 2012 at 23:13

dbf

3,4631 gold badge27 silver badges34 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Richard Over a year ago

this is perfect, i'm new to this webpage programming stuff so i wasn't aware of this whole client/server sided issue. Thank you very much, was extremely helpful. One more thing, when I clicked the button the content shows but the page doesn't scroll down so if you don't know what to expect you might miss it. What is it called when you want to force the page to scroll down to show the new content. Is it called anything special? I can look it up and figure out how to do it myself if you just point me in the right direction. Again, thanks a lot for the help.

dbf Over a year ago

Yes scrolling to bottom, first, get to know a javascript framework jquery or prototype, this makes it more cross-browser compatible. In javascript you could use something like window.scrollTo(0, document.body.scrollHeight); (not tested). Second, you do not have to work with display:block; / display:none; etc, you can also work with disabling the select field (only use one), and only change the text "Attending persons NOT including me" etc.

Richard Over a year ago

okay great, the scrollto method worked perfectly. Nothing about code but i could use a good opinion. If say the user selects 20 people, rather than display a textbox for First Name/ Last Name/ Phone/ Email 20 times, all one after another, is there a better way for them to enter the information for 20 people. Is there anything more aesthetically pleasing i can do rather than just blast them with textboxes to fill out?

Abhi Beckert · Accepted Answer · 2012-09-09 22:35:20Z

0

You need to add an id to your form tag, so that javascript can find it easily.

You need an "onchange" event on the radio buttons, to submit the form whenever anything changes.

And finally, add a submit button and use javascript to remove it from the page. This way if something goes wrong with the javascript (or if it's turned off), people will still be able to use your website. The button will be deleted before it even gets drawn on the screen, so it's as if it wasn't there for anyone with javascript. Be sure to test the page with and without javascript.

Here's the things you need to add to your code:

<form id="selectnum_form">
  <input type="radio" onchange="document.getElementById('selectnum_form').submit()"/>
  <input type="radio" onchange="document.getElementById('selectnum_form').submit()"/>

  <input type="submit" value="go" id="selectnum_submit"/>
  <script type="text/javascript">document.getElementById('selectnum_submit').style.display = 'none';</script>
</form>

answered Sep 9, 2012 at 22:35

Abhi Beckert

33.5k12 gold badges89 silver badges115 bronze badges

2 Comments

Richard Over a year ago

So instead of using javascript, can i just have the onchange call a php function that then notes which radio button is selected. If so, any hints on how to go about that exactly? Thanks a lot btw

Abhi Beckert Over a year ago

The code you've got should pretty much work with the code in my answer. Whatever radio button was clicked will be in $_POST. Do var_dump($_POST) to see what it's doing. The advantage of my answer over @dbf's one is mine will still work when javascript is disabled or broken. You should probably try both, learn how each one works, and then decide what to do.

Collectives™ on Stack Overflow

PHP Using value of radio button

2 Answers 2

3 Comments

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related