1

Looking for solution how i can POST 2 of my radio button value when it checked or not.

my code is 

<input name="r1" id="r1" type="radio">r1
<input name="r2" id="r2" type="radio">r2

when i submiting the form i want 2 params to be POSTed: r1: value r2: value

value = 1 (if selected) but need to pass also 0 if not selected.

tryied to set the value on submit button onclick action, but it's not helps.

user2988257
  • 882
  • 4
  • 25
  • 43

2 Answers2

1

Simply put:

You can't. Use checkboxes if you want to post two or more values.

<input type="checkbox" name="check[]" value="1">
<input type="checkbox" name="check[]" value="2">
  • With those `name`s, won't the value of the second over-write the value of the first on submission/receipt? – David Thomas Nov 17 '13 at 16:01
  • @Christian yes, it's an option by in the end of the day i need that user will able to select only one option. should i try to play with onclick action to disable other checkbox when something selected? or maybe some other ways to make checkboxes act like radio? – user2988257 Nov 17 '13 at 16:02
  • 2
    Why do you need to do this? Simply put: if you an user is only allowed to select one option, go with the radio, and if the user is allowed to select multiple options, use checkboxes. @user2988257 –  Nov 17 '13 at 16:06
  • @DavidThomas Ah, forgot the `[]`. –  Nov 17 '13 at 16:07
  • @DavidThomas: No, they both get sent. `[]` is a PHP thing. – Ry- Nov 17 '13 at 16:09
  • my server side expect 2 posts: r1: 0 r2: 1 or something like this – user2988257 Nov 17 '13 at 16:11
  • @minitech Sure about that? http://stackoverflow.com/questions/4997252/get-post-from-multiple-checkboxes –  Nov 17 '13 at 16:12
  • 2
    @user2988257 You've two choices — change how HTTP works, or change your serverside script to handle one value. I know which one I'd pick ;) – anotherdave Nov 17 '13 at 16:23
  • @Christian: Yes, note how that question is about PHP – Ry- Nov 17 '13 at 16:53
  • ops.. tryied to implement this solution, i found it's good for some my different need (to pass empty params to next page) but still not good for what i was looking for. i think it should be done with js.. just looking for a way to do it with onclick action.. – user2988257 Nov 17 '13 at 16:57
  • @user2988257 Preventing user from selecting more than one? Are you using jQuery? –  Nov 17 '13 at 16:58
0

You should have both <input>s be of different names and IDs and create a new radio for each "false" state; then bind a Javascript listener to the onClick event - using jQuery:

Code

<input type="radio" name="radio1" id="radio1" value="1"> R1
<input type="radio" name="radio1" id="radio1_2" value="0" style="display: none">
<input type="radio" name="radio2" id="radio2" value="1"> R2
<input type="radio" name="radio2" id="radio2_2" value="0" style="display: none">

$("#radio1").click(function() {
  $("#radio2").prop("checked", false);
  $("#radio2_2").prop("checked", true);
});
$("#radio2").click(function () {
  $("#radio1").prop("checked", false);
  $("#radio1_2").prop("checked", true);
});

Explanation

You set each of the two radios a different name; thus, each pertains to a different group. You must have a different radio for the false-like value of each input (its style was set to hidden, since the two radio groups should look like they're a single one). There is a problem: if you check one, the other won't be unchecked. Help!

But you want only one of them to be checked at a time. The Javascript/jQuery function deals with that as follows:

  • If #radio1 is clicked (and thus checked), #radio2 must be unchecked;
  • It then checks the hidden button from the radio2 group, that is, #radio2_2;
  • The reverse happens if #radio2 is clicked (#radio1 is unchecked and #radio1_2, checked).

This is an elegant (albeit arguably hacky) solution to what you want to do. It could work if the hidden radios' types was hidden instead of radio, though I'm not sure how. Making them hidden radios makes it easy to handle them as GET/POST values.

gchiconi
  • 624
  • 1
  • 7
  • 17
  • Will also depend on the user having JavaScript enabled. Know it's a minority that don't, but still worth considering. – anotherdave Nov 17 '13 at 16:26
  • Of course, but this is the only solution filling the requirements without changing anything server-side. – gchiconi Nov 17 '13 at 16:34