Remove attribute "checked" of checkbox

JavascriptJqueryIosCordovaJquery Mobile

Javascript Problem Overview


I need remove the attribute "checked" of one checkbox when errors occur.

The .removeAttr function not work. Any idea? :/

HTML

<div data-role="controlgroup" data-type="horizontal" data-mini="true" style="margin-left: auto; margin-right: auto; width: 100%; text-align: center;">
	<input type="checkbox" id="captureImage" name="add_image" class="custom" />
	<label for="captureImage" data-icon="checkbox">Image</label>
	<input type="checkbox" id="captureAudio" name="add_audio" class="custom" />
	<label for="captureAudio" data-icon="checkbox">Audio</label>
	<input type="checkbox" id="captureVideo" name="add_video" class="custom" />
	<label for="captureVideo" data-icon="checkbox">Video</label>
</div>

Javascript

$("#captureImage").live("change", function() {
	// $("#captureImage").prop('checked', false); // Here Work

	if($("#captureImage:checked").val() !== undefined) {
			navigator.device.capture.captureImage(function(mediaFiles) {
	        console.log("works");
    	}, function(exception) {
    		$("#captureImage").prop('checked', false); // Not Works Here
    		_callback.error(exception);
    	}, {limit: 1});
	}
});

/*
$("#captureAudio").live("change", function() {
	if($("#captureAudio:checked").val() !== undefined) {
			navigator.device.capture.captureAudio(function(mediaFiles) {
	        console.log("audio");
    	}, function() {
    		$("#captureAudio").removeAttr('checked');
    		_callback.error;
    	}, {limit: 1});
	}
});

$("#captureVideo").live("change", function() {
	if($("#captureVideo:checked").val() !== undefined) {
			navigator.device.capture.captureVideo(function(mediaFiles) {
	        console.log("video");
    	}, function(exception) {
    		$("#captureVideo").prop('checked', false);
    		_callback.error(exception);
    	}, {limit: 1});
	}
});
*/

Javascript Solutions


Solution 1 - Javascript

Try...

$("#captureAudio").prop('checked', false); 

Solution 2 - Javascript

Both of these should work:

$("#captureImage").prop('checked', false);

AND/OR

$("#captureImage").removeAttr('checked');

... you can try both together.

Solution 3 - Javascript

Try this to check

$('#captureImage').attr("checked",true).checkboxradio("refresh");

and uncheck

$('#captureImage').attr("checked",false).checkboxradio("refresh");  

Solution 4 - Javascript

I use prop attribute for unchecked the checkbox when errors occur. You don't need to use remove property for unchecked your checkbox.

$('input#IDName').prop('checked', false);

It is working fine for me. Hope it will work for you also.

Solution 5 - Javascript

Try:

$("#captureAudio")[0].checked = false;

Solution 6 - Javascript

using .removeAttr() on a boolean attribute such as checked, selected, or readonly would also set the corresponding named property to false.

Hence removed this checked attribute

$("#IdName option:checked").removeAttr("checked");

Solution 7 - Javascript

You could try $(this):

$("#captureAudio").live("change", function() {
    if($(this).val() !== undefined) { /* IF THIS VALUE IS NOT UNDEFINED */
            navigator.device.capture.captureAudio(function(mediaFiles) {
            console.log("audio");
        }, function() {
            $(this).removeAttr('checked'); /* REMOVE checked ATTRIBUTE; */
            /* YOU CAN USE `$(this).prop("checked", false);` ALSO */
            _callback.error;
        }, {limit: 1});
    }
});

Solution 8 - Javascript

try something like this FIDDLE

    try
      {
        navigator.device.capture.captureImage(function(mediaFiles) {
        console.log("works");
         });
      }
     
    catch(err)
      {
        alert('hi');
        $("#captureImage").prop('checked', false);
       
      }
        

Solution 9 - Javascript

In case someone's looking for an answer using pure JavaScript:

const audioLabel = document.getElementById('captureAudio');

audioLabel.removeAttribute('checked');

Solution 10 - Javascript

Sorry, I solved my problem with the code above:

$("#captureImage").live("change", function() {
	if($("#captureImage:checked").val() !== undefined) {
		navigator.device.capture.captureImage(function(mediaFiles) {
        	console.log("works");
		}, function(exception) {
	        $("#captureImage").removeAttr('checked').checkboxradio('refresh');
			_callback.error(exception);
		}, {});
	}
});

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionFabianoLothorView Question on Stackoverflow
Solution 1 - JavascriptalexView Answer on Stackoverflow
Solution 2 - JavascriptitsazzadView Answer on Stackoverflow
Solution 3 - JavascriptA. MagalhãesView Answer on Stackoverflow
Solution 4 - JavascriptLove PandeyView Answer on Stackoverflow
Solution 5 - JavascriptmacoolView Answer on Stackoverflow
Solution 6 - JavascriptSameena catView Answer on Stackoverflow
Solution 7 - JavascriptLogan WayneView Answer on Stackoverflow
Solution 8 - Javascriptrajesh kakawatView Answer on Stackoverflow
Solution 9 - JavascriptDavi MelloView Answer on Stackoverflow
Solution 10 - JavascriptFabianoLothorView Answer on Stackoverflow