We Keep Coding

Only one checbox checked with possibility check checkbox by div

I have several checkboxs on site. This checkboxs can be check by div too, but only one checkbox can be check at a time. That is the problem. When I want click on checbox by div - it works.
When I want only one checbox checked at a time - it works. But when I want both functions at once - it doesn't.
So here is code (for example):
<div class="sth">
<input type="checkbox" class="myCheck"><label>blabla</label>
</div>
<div class="sth">
<input type="checkbox" class="myCheck"><label>blabla</label>
</div>
<div class="sth">
<input type="checkbox" class="myCheck"><label>blabla</label>
</div>
And jQuery:
$("div.sth").on("click",function(event) {
var target = $(event.target);
if (target.is('input:checkbox')) return;
var checkbox = $(this).find("input[type='checkbox']");
if( !checkbox.prop("checked") ){
checkbox.prop("checked",true);
} else {
checkbox.prop("checked",false);
}
});
$('input:checkbox').on('change', function() {
$('input:checkbox').not(this).prop('checked', false);
});

Updated fiddle.
You should add the following line :
$('input:checkbox').not(this).prop('checked', false);
In your "div.sth" click event to uncheck the other checkboxes first then select the one related with clicked div.
Hope this helps.

Have you considered using radio buttons instead and just styling them with CSS to look however you want?
Otherwise use the other answer, mine second portion of this was me misunderstanding the goal.

JQuery: Check if any radio button is checked using radio button class name

I realize similar question had earlier been answered on stack overflow a few times. I checked all the questions and none were similar to mine.
I have a html form that has some radio buttons. In my validation I want to check if atleast one of the radio buttons are checked.
My approach so far:
All radio buttons have same class
All radio buttons have same name
I need to
check if atleast one of the radio button is selecetd
read the value of selected button.
My Javascript so far
function supportFormValidation(){
var isChecked = $('.radioButton').attr('checked')?true:false;
alert(isChecked);
return false;}
This always returns false. But when I try to read vale by individual IDs of each radio button it returns true. Is there any way I can check if a radio button is checked by using the class name.
JSFiddle: http://jsfiddle.net/evj9nch3/

Just use :checked.
var isChecked = !!($('.radioButton:checked').length);

In order to access the checked property you need to use the prop function (after 1.6 anyways). Because the value is either true or false, it's considered a property of the element not an attribute.
Nits answer is a better way of doing it, but look below for the reason why your implementation isn't working.
Take a look at this post for more info
Here is a link to the fiddle
function supportFormValidation() {
var isChecked = $('.radioButton').prop('checked') ? true : false;
alert(isChecked);
return false;
};
supportFormValidation();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='checkbox' class='radioButton' checked='true' />

You can use this. I checked this is working
$(".ClassName").prop("checked", true)

jQuery and If statement to de-select radio buttons

Well, I'm stuck and have been banging my head for a little while now to try to figure what I'm doing wrong.
Scenario:
I have a question with a Yes/No answer (ie 2 radio buttons). When a user selects the either Yes or No, I call a function to .toggle() a hidden div to show a link. That works great. And if they go back and check that Yes/No again it disappears again due to the .toggle()
My issue is that if a user clicks the No (and the link is shown) but then clicks the Yes I want the link that is showing due to the No result to disappear and vice-versa.
So basically only show 1 link at a time.
I figured that maybe an If statement would work but I can't seem to get it right.
My code:
<div id="Question1">
<div>Do you kazoo?</div>
<input type="radio" ID="Q1RB1" runat="server" value="Yes" text="Yes" name="RadioGroup1"/>Yes<br />
<input type="radio" ID="Q1RB2" runat="server" value="No" text="No" name="RadioGroup1"/> No
<span id="Q1RB1Results" style="display:none"> <a href=#>Click here</a></span>
<span id="Q1RB2Results" style="display:none"> <a href=#>Click here</a></span>
</div>
My jQuery code that works for each individual radio button:
$("input[id$=Q1RB1]:radio").change(function () {
$("[id$=Q1RB1Results]").toggle();
});
$("input[id$=Q1RB2]:radio").change(function () {
$("[id$=Q1RB2Results]").toggle();
});
This is the If statement I'm trying to get to work. Amy I going about this the wrong way?
if ($("input[id$=Q1RB2]").is(":checked")) {
$("input[id$=Q1RB2]:radio").change(function () {
$("[id$=Q1RB2Results]").toggle();
});
});
Thanks for any thoughts/advice. I've tried a multitude of answers here in Stackoverflow and the 'net but can't seem to figure out what I'm doing wrong. :(
~V
Update: I put a sample form and the dialogue up on JSFiddle. http://jsfiddle.net/Valien/7uN6z/4/ I tried some of the solutions mentioned here and couldn't get them working so not sure what I'm doing wrong.

When you register an event listener in JQuery (.change, .click, .blur, etc.), the Javascript engine matches the selector and applies them at that point. With that in mind, you can rearrange your code (which is close to being right) to this, which should do the trick:
/* The function you're about to define applies to all radio button
inputs whose ID ends with Q1RB2 */
$("input[id$=Q1RB2]:radio").change(function()
{
/* Inside the change function, $(this) refers to the instance that
was changed. So, this checks to see if the instance that was just
changed is currently checked, after being changed. */
if ($(this).is(":checked"))
{
// If that was the case, then toggle the item
$("[id$=Q1RB2Results]").toggle();
}
});

Try this:
$('input:radio[name=RadioGroup1]').change(function(){
var show = "#" + $(this).attr('id') + 'Results';
$('#Question1 span').hide();
$(show).show();
});

I believe this is what you need:
// declare common variables so it's easier to target
var question = $("#Question1"),
group = question.find("input[name='RadioGroup1']"),
span = question.find("span");
// change listener for each radio button group
group.click(function(){
var id = $(this).attr("id"); // get the radio button id for reference
span.each(function(){ // loop through each span and check which one to hide/show
var item = $(this);
if (item.attr("id")===id+"Results") { item.show(); } else { item.hide(); }
});
});

Having two forms which contain the same radio button group inside them?

My first question is this although I doubt if it is possible. However, if it is, it will make my life much easier.
Can you have a radio button group with 2 forms? What I mean is that the same radio button group is found in both form1 and form2.
The reason why I need this is to that if I click on the first 2 radio buttons, the form action will be to one page, while if I click on the last 2 radio buttons, the action will be to another page.
If this is not possible, I would use one form and will have to change the form action depending on which radio button I select. I will give a class to the first two radio buttons and another class to the other 2 radio buttons.
If anyone can let me know which method is better and how to implement it in jQuery, that would be great.
Many thanks in advance

You cannot have a single group of form elements be part of two separate forms. It's just not possible to construct a valid document like that.
Javascript that dynamically updates the URL in the "action" property of the parent <form> should not be too hard to do. As you suggested, the "class" attribute of the radio button elements can be used to guide the code, making it pretty flexible if you need to add one or more buttons later on.
Since you included the jQuery tag:
$(function() {
var actionMap = {
key1: 'http://yoursite.com/some/action/1',
key2: 'http://yoursite.com/some/action/2',
/* ... */
};
$('input:radio').click(function() {
var $rb = $(this);
for (var key in actionMap) {
if ($rb.hasClass(key))
$rb.closest('form').attr('action', actionMap[key]);
}
});
});
or something. You could also use an HTML5-style "data-" attribute to store the URLs directly on the radio button elements, or a key fragment of the URL. (Also might want to handle the "change" event the same way, etc.)

The one form, alternate action pages seems to be the way to go. If you're going to use classes for the radio buttons then something like this would work.
Live example
JavaScript
// override the action page based on which radio button is checked
$('#someForm').submit( function(e) {
if($('.useDefault:checked').length == 1) this.action = 'http://www.google.com';
else this.action = 'http://wikipedia.org';
});
HTML
<form id="someForm" action="#">
<input name="rad" type="radio" value="default0" class="useDefault" /><label>default0</label>
<br />
<input name="rad" type="radio" value="default1" class="useDefault" /><label>default1</label>
<br />
<input name="rad" type="radio" value="alternate0" class="useAlternate" /><label>useAlternate0</label>
<br />
<input name="rad" type="radio" value="alternate1" class="useAlternate" /><label>useAlternate1</label>
<br />
<input type="submit" value="submit"/>
</form>

I have implemented the right solution with some help from Pointy. Here is my code:
$(function() {
$('input:radio').click(function() {
var $rb = $(this);
if ($rb.hasClass('class1')){
$("#myForm").attr("action", "link1.php");
}else if($rb.hasClass('class2')){
$rb.closest('form').attr("action", "link2.php");
}
});
$('#btnProceed').click(function(){
$('#myForm').submit();
});
});

select all checkboxes command jquery, javascript

I'm trying to get all of my checkboxes to be checked when clicking a link
looks like this: select all
inputs in a loop: <input type="checkbox" name="delete[$i]" value="1" />
jquery code:
var checked_status = this.checked;
$("input[name=delete]").each(function() {
this.checked = checked_status;
});
Can someone help me get it to check all.. ?
When clicking at the select all link, nothing seems to happen.. (not even an error)

Try the following.
Updated. The handler is tied to an anchor therefore there will be no this.checked attribute available.
$("#select_all").click(function(){
$("input[name^=delete]").attr('checked', 'checked');
});

jQuery Tutorial: Select All Checkbox

You're going to want to use the [name^=delete] selector ("starts with"), since your checkboxes names aren't exactly "delete", they're "delete[X]' for some number X.