Develop Reference

JQuery/Javascript: to get checkboxlist enabled or not

There is no problem for to enable or disable this kind of control but what if I only wanna know the status? To know if its status of enable or disable?
.prop("disabled",false);
.attr("disabled", true);
These are all SET not GET
or I even tried some like
$get("<%=cklst.ClientID %>").disabled;
not working.
Any hint? thx!

try:
$("#myid").prop("disabled")
Jquery docs: http://api.jquery.com/prop/
As per your example it would probably be:
$("#<%=cklst.ClientID %>").prop("disabled")
Note that to set the disabled property, you'd use:
$("#<%=cklst.ClientID %>").prop("disabled", true)
Ok, so you're using a CheckBoxList, which is slightly different. If you look at the emitted html from this code:
<asp:CheckBoxList ID="ck1" runat="server" Enabled="false"
RepeatDirection="Vertical" RepeatLayout="Table" EnableViewState="true" >
<asp:ListItem>Item 1 Disabled</asp:ListItem>
<asp:ListItem>Item 2 Disabled</asp:ListItem>
<asp:ListItem>Item 3 Disabled</asp:ListItem>
<asp:ListItem>Item 4 Disabled</asp:ListItem>
<asp:ListItem>Item 5 Disabled</asp:ListItem>
<asp:ListItem>Item 6 Disabled</asp:ListItem>
</asp:CheckBoxList>
You'll see it's something like this:
<table id="ctl00_cphMain_ck1" disabled="disabled" border="0">
<tbody><tr>
<td><span disabled="disabled"><input id="ctl00_cphMain_ck1_0" type="checkbox" name="ctl00$cphMain$ck1$0" disabled="disabled"><label for="ctl00_cphMain_ck1_0">Item 1 Disabled</label></span></td>
</tr><tr>
<td><span disabled="disabled"><input id="ctl00_cphMain_ck1_1" type="checkbox" name="ctl00$cphMain$ck1$1" disabled="disabled"><label for="ctl00_cphMain_ck1_1">Item 2 Disabled</label></span></td>
</tr><tr>
<td><span disabled="disabled"><input id="ctl00_cphMain_ck1_2" type="checkbox" name="ctl00$cphMain$ck1$2" disabled="disabled"><label for="ctl00_cphMain_ck1_2">Item 3 Disabled</label></span></td>
</tr><tr>
<td><span disabled="disabled"><input id="ctl00_cphMain_ck1_3" type="checkbox" name="ctl00$cphMain$ck1$3" disabled="disabled"><label for="ctl00_cphMain_ck1_3">Item 4 Disabled</label></span></td>
</tr><tr>
<td><span disabled="disabled"><input id="ctl00_cphMain_ck1_4" type="checkbox" name="ctl00$cphMain$ck1$4" disabled="disabled"><label for="ctl00_cphMain_ck1_4">Item 5 Disabled</label></span></td>
</tr><tr>
<td><span disabled="disabled"><input id="ctl00_cphMain_ck1_5" type="checkbox" name="ctl00$cphMain$ck1$5" disabled="disabled"><label for="ctl00_cphMain_ck1_5">Item 6 Disabled</label></span></td>
</tr>
</tbody></table>
(Now this could vary depending on what type of value you have set for ClientIDMode, and the other parent controls IDs.)
What ASP.NET has done is create a table html element with (effectively) the single ID of your CheckBoxList, and then on each row in the table, you have an html checkbox element with an ID that has been enumerated, eg. ctl00_cphMain_ck1_0, ctl00_cphMain_ck1_1, ctl00_cphMain_ck1_2, etc.
Each of those checkboxes has been set with a disabled property.
So on the client side, when dealing with the checkboxes, you have to target them more specifically. If you just use the CheckBoxList ID, you're going to get an incorrect value, because JQuery won't recognise a disabled property on a table element. So you need to look at one (or more) of the child checkboxes.
So you could do something like this:
$("#<%=cklst.ClientID %> input")[0].prop("disabled")
That's effectively saying: for the checkbox list TABLE element, get me the first input child element, and tell me what the disabled property is.
Make sense?

How to change running site content with JavaScript?

Assume that, there are many checkboxes in any site and they are unchecked. Site works in any server. I have not site code. I want to make checked some of those checkboxes. To find checkboxes by value of <td> Can I do this with JavaScript? How can I run JavaScript code in that site code? My aim is to show checkboxes as "checked".
<tr>
<td id ="id1" name"name1">value1</td>
<td><input id="checkid1" name="checkname1" type="checkbox" value="false"></td>
</tr>
<tr>
<td id ="id2" name"name2">value2</td>
<td><input id="checkid2" name="checkname2" type="checkbox" value="false"></td>
</tr>
<tr>
<td id ="id3" name"name3">value3</td>
<td><input id="checkid3" name="checkname3" type="checkbox" value="false"></td>
</tr>
If it is possible, I want to enter, value1, value2 and JavaScript will make checked related checkboxes.

You can achieve this with JQuery.
Check if a checkbox is checked and than set checked true for the desired other checkboxes.
http://jquery-howto.blogspot.be/2008/12/how-to-check-if-checkbox-is-checked.html
To search by value you can do something like this:
$("input:checkbox[value=val]").attr("checked", true);

Get respective value which is checked by chk Box in HTML Table

As I have generated HTML Table (Asp.net Table),
now I need the value of the Cell One when that respective checkBox is checked.
Suppose the second check box is clicked I need the value of the second row
E.g. if month 2 is clicked I need the value 553.5000
USING JAVA SCRIPT.
As well as the total of the same..
Total of the check value..
<table border="2" id="ctl00_ctl00_B_A_ucStudentRegistration1_TblTotalPay">
<tbody><tr>
<td class="caption">Total Amount</td><td class="caption">Paid Fees</td>
</tr><tr style="border-width: 3px; border-style: solid;">
<td>5889.2400</td><td><span disabled="disabled"><input type="checkbox" onclick="javascript:toggleCheckBoxes(this);" disabled="disabled" checked="checked" name="ctl00$ctl00$B$A$ucStudentRegistration1$chkMonth1" id="ctl00_ctl00_B_A_ucStudentRegistration1_chkMonth1"><label for="ctl00_ctl00_B_A_ucStudentRegistration1_chkMonth1">Month1</label></span></td>
</tr><tr>
<td>553.5000</td><td><input type="checkbox" onclick="javascript:toggleCheckBoxes(this);" name="ctl00$ctl00$B$A$ucStudentRegistration1$chkMonth2" id="ctl00_ctl00_B_A_ucStudentRegistration1_chkMonth2"><label for="ctl00_ctl00_B_A_ucStudentRegistration1_chkMonth2">Month2</label></td>
</tr><tr>
<td>885.6000</td><td><input type="checkbox" onclick="javascript:toggleCheckBoxes(this);" name="ctl00$ctl00$B$A$ucStudentRegistration1$chkMonth3" id="ctl00_ctl00_B_A_ucStudentRegistration1_chkMonth3"><label for="ctl00_ctl00_B_A_ucStudentRegistration1_chkMonth3">Month3</label></td>
</tr><tr>
<td>553.5000</td><td><input type="checkbox" onclick="javascript:toggleCheckBoxes(this);" name="ctl00$ctl00$B$A$ucStudentRegistration1$chkMonth4" id="ctl00_ctl00_B_A_ucStudentRegistration1_chkMonth4"><label for="ctl00_ctl00_B_A_ucStudentRegistration1_chkMonth4">Month4</label></td>
</tr><tr>
<td>553.5000</td><td><input type="checkbox" onclick="javascript:toggleCheckBoxes(this);" name="ctl00$ctl00$B$A$ucStudentRegistration1$chkMonth5" id="ctl00_ctl00_B_A_ucStudentRegistration1_chkMonth5"><label for="ctl00_ctl00_B_A_ucStudentRegistration1_chkMonth5">Month5</label></td>
</tr><tr>
<td>553.5000</td><td><input type="checkbox" onclick="javascript:toggleCheckBoxes(this);" name="ctl00$ctl00$B$A$ucStudentRegistration1$chkMonth6" id="ctl00_ctl00_B_A_ucStudentRegistration1_chkMonth6"><label for="ctl00_ctl00_B_A_ucStudentRegistration1_chkMonth6">Month6</label></td>
</tr><tr>
<td>553.5000</td><td><input type="checkbox" onclick="javascript:toggleCheckBoxes(this);" name="ctl00$ctl00$B$A$ucStudentRegistration1$chkMonth7" id="ctl00_ctl00_B_A_ucStudentRegistration1_chkMonth7"><label for="ctl00_ctl00_B_A_ucStudentRegistration1_chkMonth7">Month7</label></td>
</tr>
</tbody></table>

Your question doesn't disclose what you're really after and doesn't provide a dev-friendly example, but let's try anyway, shall we?
Check out the Working Demo (open the console).
Here's the JS for your convenience
$('.TotalPay input[type=checkbox]').change(function(){
var amount = $(this).parent().siblings().text();
console.log(amount);
});
Using JavaScript, we can bind event handlers to DOM elements from outside the markup, thus leaving the HTML clean and semantic. onXXXXX attributes might work, but you should really read about Unobtrusive JS.
In my example I chose jQuery, which greatly simplifies tedious tasks like DOM traversal. Basically, here's what this snippet do:
Grab the relevant checkboxes by CSS selector,
attach an anonymous handler to their 'change' event.
in it, traverse for the checkbox's 'uncle' and store its text in the amount variable
p.s. Please use semantic classnames for your elements. .net screws up your IDs, so IMO just rely more heavily on classes.
Also, "jQuery is great, learn JavaScript first"™.

Radio button value

I have a dynamically generated radio button as fiven below
echo '<tr>
<td colspan="2">Login System</td>
<td colpan="2">
<input type="radio" name="login_system'.$i.'" value="COMMON" checked="checked" />Common &nbsp
<input type="radio" name="login_system'.$i.'" value="INDIVIDUAL">Individual
</td>
</tr>';
and i need to take its value using javascript. Below is the code i have written for that
d['login_system']=$('input[name="login_system'+index+'"]').val();
But always I am getting value of first radio button even if I have selected second.
Can anyone help me?

$('input[name="login_system'+index+'"]:checked').val()

Horizontally and vertically exclusive radio button

Been using this site for ages and have never had to go as far as to ask my own question... cheers in advance.
I have a group of "questions" which are to be listed. The user then has to rank these questions as 1st, 2nd, and 3rd (there can be many more than three questions however).
The problem I have is that, if I make the radio button mutually exclusive in one direction - the user could rank all questions as #2, however if I make them mutually exclusive in the other direction, a user could rank the same question as #1, #2, AND #3.
Is there a way (maybe using jquery/Jscript) to make the radio buttons mutually exclusive in both directions?
EXAMPLE:
<table>
<tr>
<th>Question</th><th>Rank #1</th><th>Rank #2</th><th>Rank #3</th>
</tr><tr>
<td>QUESTION 1</td>
<td><input type="radio" name="rank1" value="1" id="1_1" /></td>
<td><input type="radio" name="rank2" value="1" id="1_2" /></td>
<td><input type="radio" name="rank3" value="1" id="1_3" /></td>
</tr><tr>
<td>QUESTION 2</td>
<td><input type="radio" name="rank1" value="3" id="3_1" /></td>
<td><input type="radio" name="rank2" value="3" id="3_2" /></td>
<td><input type="radio" name="rank3" value="3" id="3_3" /></td>
</tr>
In the above example, the value is the question's ID (from the DB)

Creative solution:
Why don't you use a widget?
you could put questions like layers you can drag and move, example:
http://jqueryui.com/demos/sortable/
http://jqueryui.com/demos/draggable/#sortable
The first to appear would be the first one.

You would have to use jQuery to get this effect working as I can't see a way of it working out of the box with HTML. Here is an example the gives the desired effect:
$(document).ready(function() {
$(':radio').click(function() {
$(this).parent().siblings().children(':radio').attr('checked', false);
});
});