Develop Reference

Retain value of radio button after validation php

My issue is once user click submit the form should check for all questions that the radio button is checked.
It should show the err message on the questions where the user didn't answer.
But right now the form refreshed everytime after the err message is shown and the
previous checked radio button is lost.I also have javascript timer going on,but
since the page get refreshed ,the timer starts all over again.
Im newbie to php,kindly guide me through this issue.Any help is appreciated.
<?php session_start()?>
<?php
$errorexist=false;
if (isset($_POST["submit"])){
for ($y=0;$y<5;$y++)
{
if(empty($_POST["question".$y])){
$errorexist=true;
${"err".$y}="* Please answer question ".($y+1)."<br>";
}
}
if (errorexist==false){
header ("Location: result.php");
exit;}
} ?>
html part of the code
<li>
<span class="error"><?php echo $err0?></span>
<h3>What is the smallest prime number?</h3>
<input type="radio" name="question0" value="A"<?php echo ($question0=='A')? 'checked':''; ?> />2<br>
<input type="radio" name="question0" value="B"<?php echo ($question0=='B')? 'checked':''; ?> />1<br>
<input type="radio" name="question0" value="C"<?php echo ($question0=='C')? 'checked':''; ?> />3<br>
<input type="radio" name="question0" value="D"<?php echo ($question0=='D')? 'checked':''; ?> />4<br>
</li>

Put a condition, where if any radio button misses it displays the
error message and no need to refresh the page. Inside the PHP code,
Request submit button
Request all the radio button. i.e $question1 = $_REQUEST['question1'];
check if all the values are set and not empty if(isset($question1) && !empty($question1) && $question1 !== '')
do this for all, close this condition with the error message.
This might help.

Form validating radio buttons by class name

I'm using the following script:
if($('.fmscr:checked').val()){
$('.fmscr').closest('.form-group').removeClass('has-error');
$('.fmscr').closest('.form-group').addClass('has-success');
}else{
$('.fmscr').closest('.form-group').addClass('has-error');
$('.fmscr').closest('.form-group').removeClass('has-success');
}
On the following radio in a form:
<div class='form-group'>
<div class='col-xs-12'>
<p>
Were you subject to the (FMSCR's) Department of Transportation (DOT) Regulations while employed?<span class='req'> *</span>
</p>
<label class='radio-inline'>
<input type='radio' class='fmscr checked' name='fmscr[]' value='1'> Yes
</label>
<label class='radio-inline'>
<input type='radio' class='fmscr checked' name='fmscr[]' value='-1'> No
</label>
</div>
</div>
There is an undetermined amount of radio buttons. The script above is run on submission, but it doesn't count the radio buttons until both were checked, and also only one radio button is checked. So what am I doing wrong here? I want to be able to have all radio buttons checked regardless of quantity and have them be able to validate properly. Please let me know if any further information is needed! Thank you in advance.

If you indeed have multiple groups of radio buttons sharing the same class selector, the following code should help:
$('.fmscr:checked').each(function() {
if( this.value ) {
$(this).closest('.form-group').removeClass('has-error');
$(this).closest('.form-group').addClass('has-success');
} else {
$(this).closest('.form-group').addClass('has-error');
$(this).closest('.form-group').removeClass('has-success');
}
});

Your code
if ($('.fmscr:checked').val())
...only takes into account the first found element that match the selector. See here for details: http://api.jquery.com/val/
I didn't understand exactly what you want to do, but you can try it like this:
if ($('.fmscr:checked').length > 0 )) // at least one is checked
Good luck!

how to bind click event to checkbox label

I'm hoping a javascript / jquery guru can help me out.
I'm trying to figure out a way to launch a popup box (fancybox) from the click of a checkbox label. I don't want to effect the checkbox function which filters data when clicked.
I would welcome any thoughts on how I can make this happen. I've tried an onclick function on the label but that doesn't work.
I want to show a fancybox when you click on a persons name in the checkbox label. Here's the site:- (example: jonathanlyon)
http://monkeygetnews.jonathanlyon.com/bs.php
The checkboxes are built dynamically and I need to create a click event on the label that opens a fancybox. Here's the code to build the checkboxes:-
<input type="checkbox" id = "dn" value="dept_<?php echo $currdept;?>" onchange="doSearch();return false;" />
<label><?php echo $currdept;?></label>
<ul class="dept_<?php echo $currdept;?>">
<li>
<input type="checkbox" name = "un" value="<?php echo $usernames;?>" <?php echo $include;?> onchange="doSearch();return false;" />
<label><?php echo $usernames;?></label>
</li>
<?php
$dept = $currdept;
} else {
?>
<li>
<input type="checkbox" name = "un" value="<?php echo $usernames;?>" <?php echo $include;?> onchange="doSearch();return false;" />
<label><?php echo $usernames;?></label>
</li>
<?php
$dept = $currdept;
}
?>
Thanks
Jonathan

Very simply put you can use jquery like this
$('label').click(function() {
alert($(this).html());
}
again, this is a very simple example and would need improvement

You need to wrap checkbox tag with label tag to make label clickable like
<label><input type="checkbox" name="checkbox" value="value"/>dasfaha</label>
Edit:
Sorry guys. I didn't look carefully. Here is how to detect label or checkbox.
How it works is that when you click unbounded label, checkbox won't be changed. However, when you click checkbox, ':checked' will be changed. Thus, you can put a variable to store previous value of checked, then compare with current checked.
http://jsfiddle.net/Xtyah/

validate field in javascript and jquery

I have four radio buttons. If I select the last radio button then one textbox is appearing. I handled this scenario by jquery. Now I want to validate in such a way that if user gets this textbox means if user checked the last radio button, then he should provide some text.But in my case, if I check any one of the radio button, its telling to provide some text. The code is like:
<input type="radio" name="bus_plan" id="smallBtn" value="1" />1
<input type="radio" name="bus_plan" id="smallBtn" value="2" />2
<input type="radio" name="bus_plan" id="smallBtn" value="3" />3
<input type="radio" name="bus_plan" id="smallBtn" value="Promotional" />
<span class="plantxt"><a style="cursor:pointer;" onclick="popup('popUpDiv')">Promotional Plan</a> (Please enter a promotional code)</span>
<div class="reg-line" id="pr_code_id" style="display:none">
<div class="reg-linea" align="left">Promotional Code: <sup>*</sup></div>
<input type="text" name="bus_prcode" id="bus_prcode" class="reg-line-input" value="Promotional Code" onblur="if(this.value=='') this.value='Promotional Code'" onClick="if(this.value==this.defaultValue) this.value='';" />
<br />
<div>
<div id="promotionalbox" style="display:none;font-size:13px;clear:both"></div>
</div>
</div>
<script type="text/javascript" src="js/jquery-1.7.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("input:radio[name=bus_plan]").click(function(){
var values = $(this).val();
if(values == 'Promotional'){
$('#pr_code_id').show();
}else{
$('#pr_code_id').hide();
}
});
});
</script>
and in js if I alert the value of document.getElementById('bus_prcode').value then always it is showing Promotional code, which is only for last radio button value.

Your code is a bit of a mess which is the root of this problem. Remember, one element per ID.
You may also find it helpful to look at jQuery .is(), for example:
$('input[value="Promotional"]').is(':checked')
n.b. I do not suggest the above, you should use identifiers in the appropriate way first.
Also worth noting that your code works fine for me using Chrome. See an example (which I have expanded for you) here: http://jsbin.com/ofujal/3/

You should not have an element with the same ID (your radio buttons). Also, you're getting the textbox by running document.getElementById('bus_prcode') and not the radio button. You should give a unique ID to your last radio button, e.g. btnPromotional, then bind click to it:
$("#btnPromotional").click(...)

javascript jquery radio button click

I have 2 radio buttons and jquery running.
<input type="radio" name="lom" value="1" checked> first
<input type="radio" name="lom" value="2"> second
Now, with a button I can set onClick to run a function. What is the way to make radio buttons run a function when I click on one of them?

You can use .change for what you want
$("input[#name='lom']").change(function(){
// Do something interesting here
});
as of jQuery 1.3
you no longer need the '#'. Correct way to select is:
$("input[name='lom']")

If you have your radios in a container with id = radioButtonContainerId you can still use onClick and then check which one is selected and accordingly run some functions:
$('#radioButtonContainerId input:radio').click(function() {
if ($(this).val() === '1') {
myFunction();
} else if ($(this).val() === '2') {
myOtherFunction();
}
});

<input type="radio" name="radio" value="creditcard" />
<input type="radio" name="radio" value="cash"/>
<input type="radio" name="radio" value="cheque"/>
<input type="radio" name="radio" value="instore"/>
$("input[name='radio']:checked").val()

this should be good
$(document).ready(function() {
$('input:radio').change(function() {
alert('ole');
});
});

There are several ways to do this. Having a container around the radio buttons is highly recommended regardless, but you can also put a class directly on the buttons. With this HTML:
<ul id="shapeList" class="radioList">
<li><label>Shape:</label></li>
<li><input id="shapeList_0" class="shapeButton" type="radio" value="Circular" name="shapeList" /><label for="shapeList_0">Circular</label></li>
<li><input id="shapeList_1" class="shapeButton" type="radio" value="Rectangular" name="shapeList" /><label for="shapeList_1">Rectangular</label></li>
</ul>
you can select by class:
$(".shapeButton").click(SetShape);
or select by container ID:
$("#shapeList").click(SetShape);
In either case, the event will trigger on clicking either the radio button or the label for it, though oddly in the latter case (Selecting by "#shapeList"), clicking on the label will trigger the click function twice for some reason, at least in FireFox; selecting by class won't do that.
SetShape is a function, and looks like this:
function SetShape() {
var Shape = $('.shapeButton:checked').val();
//dostuff
}
This way, you can have labels on your buttons, and can have multiple radio button lists on the same page that do different things. You can even have each individual button in the same list do different things by setting up different behavior in SetShape() based on the button's value.

it is always good to restrict the DOM search. so better to use a parent also, so that the entire DOM won't be traversed.
IT IS VERY FAST
<div id="radioBtnDiv">
<input name="myButton" type="radio" class="radioClass" value="manual" checked="checked"/>
<input name="myButton" type="radio" class="radioClass" value="auto" checked="checked"/>
</div>
$("input[name='myButton']",$('#radioBtnDiv')).change(
function(e)
{
// your stuffs go here
});