Develop Reference

prop('disabled', false); is not working

I want to make a button that will be disable when checkbox is false. But prop('disabled', false); isn't working.
$(function() {
$(this).click(function() {
if ($('#аgree').prop(':checked')) {
$('#button').prop('disabled', false);
} else {
$('#button').prop('disabled', true);
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p class="text-center">З правилами анкетування ознайомлений(а) і згоден(на) #Html.CheckBox("Agree", false, new { id = "agree" }) </p>
<p class="text-center"><input type="button" id="button" disabled="disabled" value="Пройти анкетування" onclick="location.href='#Url.Action("Form")'" /></p>

In your code, this refers to the DOM.
Change it to
$("#agree").change(function() {
if ($(this).is(':checked')) {
$('#button').prop('disabled', false);
} else {
$('#button').prop('disabled', true);
}
});
Inside the event handler, this refers to the element that triggered the change event.
or simply:
$("#agree").click(function() {
$('#button').prop('disabled', !$(this).is(':checked'));
});

You can try removing the attribute.
$('#button').removeAttr('disabled')

Check if the checkbox is checked with .is(":checked"),
also, listen to a change event on the checkbox itself.
Below is a little modified code (to make it work here)
$(function() {
$('#agree').change(function() {
if ($(this).is(':checked')) {
$('#button').prop('disabled', false);
} else {
$('#button').prop('disabled', true);
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p class="text-center">З правилами анкетування ознайомлений(а) і згоден(на) <input type=checkbox id=agree> </p>
<p class="text-center"><input type="button" id="button" disabled="disabled" value="Пройти анкетування" onclick="location.href='#Url.Action("Form")'" /></p>

To disable button, you can use:
$('#button').attr('disabled', 'disabled');
To make button active, you can use:
$('#button').attr('disabled', '');

Checkbox Check for yes command in javascript

I want to get done, When i try to checked checkbox, It will show popup. Then, there have a two option as "Yes" and "NO". When i click "yes" checkbox will checked and popup close. If i choose "NO" checkbox will unchecked and close popup.
Give me a help on this. Sample code here
Javascript
$(document).ready(function () {
$('#chkBox').click(function () {
if ($(this).is(':checked')) {
$("#txt").dialog({
close: function () {
$('#chkBox').prop('checked', false);
}
});
} else {
$("#txt").dialog('close');
}
});
});
HTML
<input type="checkbox" id="chkBox" name="HelpCheckbox" value="Help" />
<div id="txt" style="display: none;">
<button>Yes</button>
<button>NO</button>
</div>
Live sample here :
http://jsfiddle.net/5vy1m233/37/
Please help. Thank you.

Try adding a buttons:{} object property instead of having two extra buttons in the markup. This setting will create buttons for you and in those buttons you can choose to check/uncheck the checkbox:
$(document).ready(function() {
$('#chkBox').click(function() {
var $chkBox = $('#chkBox'),
$txt = $('#txt');
$txt.dialog({
buttons: {
Yes: function() {
$chkBox.prop('checked', true); // check if Yes
$txt.dialog('close'); // and close the popup
},
No: function() {
$chkBox.prop('checked', false); // uncheck if No
$txt.dialog('close'); // and close the popup
}
}
});
});
});
<link href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<input type="checkbox" id="chkBox" name="HelpCheckbox" value="Help" />
<div id="txt" style="display: none;">
</div>

<input type="checkbox" id="chkBox" name="HelpCheckbox" value="Help" onClick="confirmation(this);"/>
function confirmation(obj) {
obj.checked ? confirm("You have chosen " + obj.value + " as your type \n If you have chosen the right type, Click Ok!") ? alert("You clicked ok") : obj.checked = false : "";
}

you just have to put id on those button and add function and run it with 'onlick'
html
<button onClick="btn_yes()">Yes</button>
<button onClick="btn_no()">NO</button>
js
function btn_yes(){
$("#txt").dialog('close');
document.getElementById("chkBox").checked = true;
}
function btn_no(obj){
$("#txt").dialog('close');
}
here jsfiddle
http://jsfiddle.net/5vy1m233/40/

Disable a textbox if checkbox is checked

I have an HTML table where there is a checbox and a textbox in everyrow. The idea here is every time a checkbox is checked, the textbox will be disabled. Here is the code:
<table>
<tr>
<td>Value1</td>
<td>Value2</td>
<td><input type="text" class="textbox" /></td>
<td><input type="checkbox" class="Blocked" onclick="myFunction(this)"/></td>
</tr>
</table>
<script src="/Scripts/jquery-1.7.1.js"></script>
<script type="text/javascript">
function myFunction(chk) {
//disable the textbox here
}
</script>
Can you help me with this? Also, if I unchecked the checbox, I want my textbox to be enabled back. Thanks!!

Would something like below work for you?
$('.Blocked').change( function() {
var isChecked = this.checked;
if(isChecked) {
$(this).parents("tr:eq(0)").find(".textbox").prop("disabled",true);
} else {
$(this).parents("tr:eq(0)").find(".textbox").prop("disabled",false);
}
});
JSFiddle: http://jsfiddle.net/markwylde/LCWVS/6/
Compacted, it would look a little like:
$('.Blocked').change( function() {
$(this).parents("tr:eq(0)").find(".textbox").prop("disabled", this.checked);
});
JSFiddle: http://jsfiddle.net/markwylde/LCWVS/4/

Sticking with the inline event handler:
function myFunction(chk) {
$(chk).closest('tr').find('.textbox').prop('disabled', chk.checked);
}
The jQuery way:
$('.Blocked').change(function() {
$(this).closest('tr').find('.textbox').prop('disabled', this.checked);
});

Try:
function myFunction(chk) {
document.getElementsByClassName("textbox")[0].disabled = chk.checked;
}

<input type="text" name="dateFrom" id="t2" style="width:100px"/>
<input type="text" name="dateTo" id="text" style="width:100px"/>
<script>
$(document).ready(function () {
$('#check').change(function () {
$("#t2").attr("disabled", "disabled");
$("#text").attr("disabled", "disabled");
});
$('#check').click(function () {
if (!$(this).is(':checked')) {
$("#t2").removeAttr("disabled");
$("#text").removeAttr("disabled");
}
});
});
</script>

Try this it allows you to disable and enable a textbox, if you want to disable multiple textboxes change it to getElementsByClassName("textboxes") then give all your textfields that class name.
function disableElement()
{
textbox = document.getElementById("text");
if(textbox.disabled)
{
bunit.disabled=false;
}
else
{
bunit.disabled=true;
}
}
Then have a checkbox and a textfield with the the textfield called text
<input type="checkbox" name="check" onclick="disableElement();">
<input type="text" id="text">

Once I remove an attribute I cant add it

I am trying to make a select all checkbox but when I deselect it and select it again it just doesn't select the boxes anymore. While it does work at the first time.
This is my code:
HTML:
<div id="Everything">
<input type="checkbox" id="all" />Select All
<br />
<br />
<div id="selectThese">
<input type="checkbox" id="First" />First
<br />
<input type="checkbox" id="Second" />Second
<br />
</div>
</div>
JS:
$(function () {
$("#Everything").on("click", "#all", function () {
var carStatus = $("#all").is(':checked');
if (carStatus == true) {
$("#selectThese input").attr("checked", "checked");
} else {
$("#selectThese input").removeAttr("checked");
}
});
});
Jsfiddle link: http://jsfiddle.net/Epsju/1/

You'll need to use prop() for that, and since it accepts a boolean to check and uncheck the element, you can use your variable directly, or just ditch the variable and use this.checked :
$(function () {
$("#Everything").on("change", "#all", function () {
$("#selectThese input").prop("checked", this.checked);
});
});
FIDDLE

http://jsfiddle.net/Epsju/6/
Use change also your fiddle uses #car, when it should use #all.
$(function () {
$("#Everything").on("change", "#all", function () {
$('#selectThese :checkbox').prop('checked', $(this).is(':checked'));
});
});

Try this:-
Demo
$(function () {
$("#Everything").on("change", "#all", function () {
$('#selectThese :checkbox').prop('checked', $(this).is(':checked'));
});
});
And viceversa
$('#selectThese :checkbox').on('change', function () {
$('#all').prop('checked', $('#selectThese :checkbox:checked').length == $('#selectThese :checkbox').length)
});

Show/Hide with Checkbox using jQuery

I am trying to have a section of an html form to show/hide based on a checkbox. This is the essence code I have:
<script src="/js/jquery.js"></script>
<script language="JavaScript">
function toggle(className){
var $input = $(this);
if($(this).prop('checked'))
$(className).show();
else
$(className).hide();
}
</script>
<fieldset><legend>Check Here
<input type="checkbox" onclick="toggle('.myClass')" ></legend>
<span class="myClass">
<p>This is the text.</p>
</span>
</fieldset>
When you click on the checkbox, the span gets hidden and will not come back. I have also used $(this).is(':checked'). It appears that $(this).prop('checked') is evaluating to false whether it is checked or not. My best guess is that I am using $(this) incorrectly. What am I missing here?

HTML, pass this from on click event
<input type="checkbox" onclick="toggle('.myClass', this)" ></legend>
JS
function toggle(className, obj) {
var $input = $(obj);
if ($input.prop('checked')) $(className).hide();
else $(className).show();
}
OR, without using prop you can just do:
function toggle(className, obj) {
if ( obj.checked ) $(className).hide();
else $(className).show();
}
OR, in one-line using .toggle( display ):
function toggle(className, obj) {
$(className).toggle( !obj.checked )
}

Use an event handler that is'nt inline, and then just toggle() the element based on the checkbox state :
<script src="/js/jquery.js"></script>
<script type="text/javaScript">
$(function() {
$('input[type="checkbox"]').on('change', function() {
$(this).closest('fieldset').find('.myClass').toggle(!this.checked);
});
});
</script>
<fieldset>
<legend>Check Here<input type="checkbox"></legend>
<span class="myClass">
<p>This is the text.</p>
</span>
</fieldset>
FIDDLE
This would even work with several fieldset's with the same markup.

try binding event via jQuery, and then you can access to $(this):
$(document).ready(function() {
$(":checkbox").click(function(event) {
if ($(this).is(":checked"))
$(".myClass").show();
else
$(".myClass").hide();
});
});

<input type="checkbox" checked>
<input type="text" id="amount">
$document.ready(function() {
$("input:checked").on("click",function () {
$("#amount").toggle()
})
});