So, I have a questions regarding the input type radio in HTML. As you know, you can put checked as a value, this will mark it as checked.
The story is I am getting a 0 or 1 value from my database. I am then checking if it's 0 or 1 and will then mark one of the radio button's as checked.
My code is as follows:
<?php if($pay_op == 0) { ?>
<input type="radio" value="paypal" id="pay_op" checked>PayPal<br />
<input type="radio" value="other" id="other_op">Other<br/>
<input type="submit" id="pay_op_submit" />
<?php } elseif ($pay_op == 1) { ?>
<input type="radio" value="paypal" id="pay_op">PayPal<br />
<input type="radio" value="other" id="other_op" checked>Other<br/>
<input type="submit" id="pay_op_submit" />
<?php } ?>
My problem now is, whenever I try to mark the other radio button as checked by clicking on it, both radio buttons are checked?
I thought that this might have something to do with me checking if the value returned from the database is 0 or 1 and it will keep one of the radio buttons checked until that value is changed. Now my question is, does anyone know a solution to this issue so that whenever someone clicks on something different than the default checked radio button it will actually check that one and not both of them?
Any tips are highly appreciated! =)
Thanks!
Radio buttons work basically as a named group. The browser only un-checks a radio button if it is linked to the other radio buttons with a property called name.
<?php
if($pay_op == 0)
{ ?>
<input name ="myGroup" type="radio" value="paypal" id="pay_op" checked>PayPal<br />
<input name ="myGroup" type="radio" value="other" id="other_op">Other<br/>
<input name ="myGroup" type="submit" id="pay_op_submit" />
<?php
}
elseif($pay_op == 1)
{ ?>
<input name ="myGroup" type="radio" value="paypal" id="pay_op">PayPal<br />
<input name ="myGroup" type="radio" value="other" id="other_op" checked>Other<br/>
<input name ="myGroup" type="submit" id="pay_op_submit" />
<?php
}
?>
Related
In html for radio button I have this:
<input type="radio" name="sex" value="male" /> Male<br />
<input type="radio" name="sex" value="female" /> Female <br />
and for check list:
<input name="checkboxvar[]" type="checkbox" value="dog" />Dog</td>
<input name="checkboxvar[]" type="checkbox" value="cat" />Cat</td>
<input name="checkboxvar[]" type="checkbox" value="rabbit" />Rabbit</td>
For the radio buttons how can I make them required and for the checkbox to take the result if the user select more than 1 values?
For the previous fields I use a submit button
<input type="submit" name="submit" id="submit" value="submit" />
by using required attribute as follows:-
<input type="radio" name="sex" value="male" required />Male
For making a radio button required, use the required tag (you only need add the required tag for one radio input per group):
<input type="radio" name="sex" value="male" required/> Male<br />
The required attribute is shorthand for required="required" or required="true" (the fact that its there constitutes a 'truthy' value, as does any (nonempty) string).
For making at least one of the checkboxes required: An answer has already been provided here; this basically states that, given a <button> element with and id of checkBtn, the following code can help (with some of my comments on it):
$(document).ready(function () {
// grabbing the button's element and adding an
// onclick event to it
$('#checkBtn').click(function() {
// grabs all elements which are checkboxes and
// are checked; if none are checked, the length
// is zero; else, the length is a 'truthy' value
checked = $("input[type=checkbox]:checked").length;
// if no elements are checked
if(!checked) {
// error handling
alert("You much check at least one checkbox.") return false;
}
});
});
Assuming that you want to detect the error upon the submit button's click; if you want to handle the error otherwise, you might want to clarify that (your answer is a tad vague).
Hope it helps!
I have a form that did submit 1 out of 8 radio buttons to a php $_POST super global array. Therefore, I needed some validation. I was kindly helped by being provided this code which works great:
$("#form").submit(function (event) {
if(!$(":radio:checked").length) {
alert("You must select at least one emotional state!");
event.preventDefault();
}
});
However, I have now been asked to have 2 sets of 8 radio buttons in which the user selects 2 answers instead of the initial 1 answer. I need the code to be able to determine that at least one radio button from each set of 8 buttons has been selected before the form is submitted. At the moment the code checks to see if any radio buttons have been selected, then as soon as just 1 buttons is selected, the function is satisfied and transitions to the next page, which is not what I want.
EDIT
Buttons code:
<p><input type="radio" value="happy" name="perceived_emotion">Happy
<input type="radio" value="excited" name="perceived_emotion">Excited
<input type="radio" value="angry" name="perceived_emotion">Angry
<input type="radio" value="frustrated" name="perceived_emotion">Frustrated
<input type="radio" value="miserable" name="perceived_emotion">Miserable
<input type="radio" value="sad" name="perceived_emotion">Sad
<input type="radio" value="tired" name="perceived_emotion">Tired
<input type="radio" value="relaxed" name="perceived_emotion">Relaxed</p>
<p><input type="radio" value="happy" name="induced_emotion">Happy
<input type="radio" value="excited" name="induced_emotion">Excited
<input type="radio" value="angry" name="induced_emotion">Angry
<input type="radio" value="frustrated" name="induced_emotion">Frustrated
<input type="radio" value="miserable" name="induced_emotion">Miserable
<input type="radio" value="sad" name="induced_emotion">Sad
<input type="radio" value="tired" name="induced_emotion">Tired
<input type="radio" value="relaxed" name="induced_emotion">Relaxed</p>
Here is the form code:
<form id="form" action="audio_handler.php?id=1" method="POST">
<div id="perceived_emotions">
<?php include("includes/induced_emotion_buttons.php"); ?>
</div>
<br />
<div id="induced_emotions">
<?php include("includes/perceived_emotion_buttons.php"); ?>
</div>
<p class="right"><input type="submit" name="submit" value="Submit"></p>
</form>
What you want to do is use the [name="value"] selector in JQuery in conjunction with the :checked selector. So your new code would be:
if(!$('input[name="perceived_emotion"]:checked').length) {
alert("You must select at least one perceived emotional state!");
event.preventDefault();
return false;
}
if(!$('input[name="induced_emotion"]:checked').length) {
alert("You must select at least one induced emotional state!");
event.preventDefault();
return false;
}
All of that wrapped into the form event.
EDIT: Since you only want to display one dialog at once, just add return false; in each if statement.
two problem i have:
first:
i want users see my form with no prechecked in radio buttons but it does when they see it at first time(as you see)(explain that i use checked to show user which radio he/she selected after pushing the button)
second:
why when i name submit button "select sex" and push it in the form, it doesn't echo "it's done" but when i name it "select" it works?! i want my submit name has two words.
and the codes:
<html>
<body>
<?php
if(isset($_POST['select sex']))
echo "it's done";
?>
<form name="input" action="" method="post">
<input type="radio" name="sex" value="male" checked="
<?php if(isset($_POST['select sex']) and $_POST['sex']=='male') echo 'checked'; else echo '';?>
"> Male<br />
<input type="radio" name="sex" value="female" checked="
<?php if(isset($_POST['select sex']) and $_POST['sex']=='female') echo 'checked'; else echo '';?>
"> Female<br />
<input type="submit" name="select sex" value="Submit" />
</form>
</body>
For checkbox, not mentioned checked attribute for any of the check box option.
For submit button, normally we are not using the space in field name and this is the best practice. Though you have used then you have written the wrong code. Please check below updated code line for if statement.
if(isset($_POST['select sex']))
I have these 4 radio buttons in which i am submitting to a validatepreferences.php which is the php code below however i am struggling to understand why when i click submit nothing is going through the if statement therefore not giving me my cookie in which to change images based on user input
<input type="radio" name="radioimage"><img class="prefimage" src="../images/image1.jpg">
<br>
<input type="radio" name="radioimage"><img class="prefimage" src="../images/image2.jpg">
<br>
<input type="radio" name="radioimage"><img class="prefimage" src="../images/image3.jpg">
<br>
<input type="radio" name="radioimage"> No Picture
I think the php code must have an error or my if is not right altough i cannot see it.
<?php
if(isset($_POST['radioimage'])){
$radioimage = $_POST['radioimage'];
if ($radioimage == "0" || $radioimage == "1" || $radioimage == "2" || $radioimage =="3") {
setcookie("image", $radioimage, time()+300);
}
}
?>
You're not giving the radiobuttons values in the form. You have to give them values so you can retrieve those values with $_POST in validatepreferences.php. So the HTML should be:
<input type="radio" name="radioimage" value="1"><img class="prefimage" src="../images/image1.jpg">
<br>
<input type="radio" name="radioimage" value="2"><img class="prefimage" src="../images/image2.jpg">
<br>
<input type="radio" name="radioimage" value="3"><img class="prefimage" src="../images/image3.jpg">
<br>
<input type="radio" name="radioimage" value="4"> No Picture
I have an HTML page that contains two radio buttons ("yes" and "no") along with a submit button.
How can I specify that I want to execute a PostgreSQL query ONLY if the submit button is pressed AND the "yes" radio button is selected?
Your radio buttons need to have the same name, so check the value that is submitted for that field:
if ($_POST['radio'] == 'Yes')
{
// Execute query
}
Given HTML like this
<form action="foo.php" method="post">
<label for="yesno_yes">
<input type="radio" name="yesno" value="yes" id="yesno_yes"> Yes
</label>
<label for="yesno_no">
<input type="radio" name="yesno" value="no" id="yesno_no"> No
</label>
<input type="submit" name="submit_btn" value="Submit">
</form>
You can check using this
<?php
if (isset($_POST['submit_btn'], $_POST['yesno']) && $_POST['yesno'] == 'yes') {
// do stuff here
}