logo
down
shadow

How to remove checked attr on a checkbox when I click it again


How to remove checked attr on a checkbox when I click it again

By : scottoftheriver
Date : November 22 2020, 09:00 AM
Hope this helps If you click an input, you need know if is checked or not. Your button init $('#button').hide(); or display:none.
code :
<div id="button" style="display:none;">YOUR BUTTON</div>

<input class="opc1" type="checkbox" value="1" />
<input class="opc2" type="checkbox" value="2" />

$('.opc1').on("click",function(){
  if($(this).prop('checked')) {
    $('#button').show();
  }else{
   $('#button').show();
  }
});
$('.opc2').on("click",function(){
  if($(this).prop('checked')) {
    $('#button').hide();
    //Also you can use $('#button').remove(); but if you need show this before don't remove.
  }
});


Share : facebook icon twitter icon
Object doesn't suport this property or method in IE8 when checking if checkbox is checked after setting attr('checked');

Object doesn't suport this property or method in IE8 when checking if checkbox is checked after setting attr('checked');


By : user3542198
Date : March 29 2020, 07:55 AM
I think the issue was by ths following , I think you've found a bug in jsfiddle. Seemed to work fine in a stand-alone web page.
On Checkbox click event, Unable to remove checked="checked' attribute

On Checkbox click event, Unable to remove checked="checked' attribute


By : user2243526
Date : March 29 2020, 07:55 AM
I hope this helps . I have a Jquery Dialog box within my view, In this dialog box there is a UL LI list which is transformed to a treeview. I retain previous checkbox checked selection by adding the checked attribute in my HTML Text Writer helper. What I am trying to do is to remove the checked attribute once its un-checked. I am able to fire the event and get the value for instance true or false for check or uncheck but I am not able to scuccessfully remove the checked attribute if it was checked. The DOM still have the previous state of checked. , Try this:
code :
function handleClick(e) {
        alert("Click, new value = " + e.target.checked);
        if (e.target.checked == false) {
            e.target.removeAttr('checked');
    }
}
if checkbox is checked remove class from div on click

if checkbox is checked remove class from div on click


By : Riya
Date : March 29 2020, 07:55 AM
wish of those help Posted a question on about the same project in the morning. After battling it for a while came up with a bit different approach. Trying to build a filter. And the idea is that a filter checkboxes have matching id's with filtered items classes. So, once a filter item clicked, filtration is applied to item class. Classes (except for inditem) and ids are dynamic , Do you mean something like
code :
var $filters = $('.filtercheck').change(function() {
  var $items = $('.inditem').hide();
  var filters = $filters.filter(':checked').map(function() {
    return '.' + this.id;
  }).get();
  if (filters.length) {
    $items.filter(filters.join()).show();
  } else {
    $items.show();
  }
});
.checkeditem {
  display: block !important
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="itemswrap">
  <div class="inditem dynamic1">dynamic1</div>
  <div class="inditem dynamic2">dynamic2</div>
  <div class="inditem dynamic3">dynamic3</div>
  <div class="inditem dynamic2">dynamic2</div>
</div>
<ul class="subnav">
  <li class="lifilter">
    <input type="checkbox" class="filtercheck" id="dynamic1" />
    <label for="dynamic1">whatever label</label>
  </li>
  <li class="lifilter">
    <input type="checkbox" class="filtercheck" id="dynamic2" />
    <label for="dynamic1">whatever label</label>
  </li>
  <li class="lifilter">
    <input type="checkbox" class="filtercheck" id="dynamic3" />
    <label for="dynamic1">whatever label</label>
  </li>
</ul>
Jquery checkbox checked get attr id on button click

Jquery checkbox checked get attr id on button click


By : surendra ayer
Date : March 29 2020, 07:55 AM
will be helpful for those in need Attach the click handler on your button and then select the checked checkboxes using :checked snippet. Then map the result returning the id values and finally call the toArray method. Here is the working code:
code :
$("#buttonClass").on("click", function() {
  var checkedIds = $(".chk:checked").map(function() {
    return this.id;
  }).toArray();
  alert(checkedIds.join(", "));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="checkboxlist">
  <div>
    <input type="checkbox" id="1" class="chk">Value 1</div>
  <div>
    <input type="checkbox" id="2" class="chk">Value 2</div>
  <div>
    <input type="checkbox" id="3" class="chk">Value 3</div>
  <div>
    <input type="checkbox" id="4" class="chk">Value 4</div>
  <div>
    <input type="checkbox" id="5" class="chk">Value 5</div>
  <div>
    <input type="button" value="Delete" id="buttonClass">
  </div>
</div>
How to click cloned label and change checkbox checked property to false & click checkbox and remove clone

How to click cloned label and change checkbox checked property to false & click checkbox and remove clone


By : geecko
Date : March 29 2020, 07:55 AM
this will help
When you use label for="one" the corresponding input should have id="one". Otherwise the label won't change the input's state as expected.
code :
<div class="wrap">
  <header></header>
  <form>
    <div class="label-wrap"><label for="one">Checkbox 1</label><input id="one" type="checkbox" /></div>
    <div class="label-wrap"><label for="two">Checkbox 2</label><input id="two" type="checkbox" /></div>
    <div class="label-wrap"><label for="three">Checkbox 3</label><input id="three" type="checkbox" /></div>

    <p>note that &lt;input&gt; will be hidden eventually and replaced with a toggled :before</p>
  </form>
</div>


$('input').on('change', function() {
  var self = $(this);
  if(self.is(':checked')) {
    self.prev('label').clone().addClass("clone")
    .appendTo("header");
    self.prev('label').addClass("is-checked");
  } else {
    $('header label[for="' + self.attr('id') + '"]').replaceWith('');
    self.prev('label').removeClass("is-checked");
  }
});
Related Posts Related Posts :
  • gulp-minify without rename original files
  • create a link to run javascript in another window
  • Javascript, Uncaught TypeError: Cannot read property "cells" of undefined
  • Express.js and Sequelize: does not define models
  • Serialize table data as IEnumerable within asp.net WebApi
  • Handle WebPack CSS imports when testing with Mocha and Babel
  • Converting JSON string to Angular function?
  • Bootstrap-multiselect is very slow with a large pool of options
  • Writing back to HTML after reading form input doesn't work (Javascript)?
  • Kendo UI Grid: Get the data of Current Grouping state?
  • A function to test if all svg objects are visible
  • how to change src without reloading the page
  • side menu with drop down menu
  • How to store timestamp a JSON object?
  • HTML5 Form Submit
  • Caret Sensurround by circle CSS
  • Chrome local storage deleting after NWJS application closes on Windows
  • cordova inappbrowser referencing elements
  • Passing multiple variables to another page
  • $.when with arbitrary number of deferred objects?
  • Printing different part of page depending on clicked element
  • Read in cookie to Shiny application with embedded javascript
  • Asynchronous array problems
  • Disable button if certain number of checkbox are checked
  • Write a loop that finds a value and returns a color
  • How to make the page layout stay the same after minimized?
  • Looping div elements using jquery
  • Node.js 'request' module wrapper with optional params - how to write this more concise?
  • Javascript , Object property is shown as undefined
  • How to trigger and wait for the result of a notification from a call back function of an event listener
  • How to populate a form box with javascript based on other form box inputs
  • Default/Overridable content for Aurelia template (template parts)
  • Ember, how to reuse same "partial" for "index" and for "show"
  • Display content from database on HTML page via Ajax and PHP
  • exporting logic as a function in express.js
  • Verifying Docusign Connect Signature with X509 Certificate
  • React js get the value from div
  • What does the notation () => mean and how to use it?
  • JQuery Hide/Show one, not all
  • Split string on backslash or forward slash
  • PHP Inside JavaScript - Quotes Issue?
  • ReactJS Unexpected Token ) on Safari only
  • Use lodash to group array into tree "children" structure
  • With D3, how can I avoid SVG graph links being rendered over nodes?
  • Consolidate nested, overlapping <strong> and <em> tags
  • How to Access an array of objects properties?
  • Simple Push Menu in CSS3 and jQuery
  • addEventListener not working for onDragStart
  • Partial string matching in javascript
  • Posting a title along with a Photo using the FB.api
  • Why is my jquery code not working or throwing any errors?
  • Javascript/jquery - Wrap text with tag at specific position
  • Javascript Canvas can't draw multiple curves
  • Javascript move entire span with arrow keys
  • How to stop my character from going outside the div?
  • How to call in plugin options in jquery plugins
  • Remove default submit on modal form button
  • Generate angular model properties by view, when view fields are empty
  • AngularJS - project files layout, injection and scope clarification
  • get text fields that are not empty
  • shadow
    Privacy Policy - Terms - Contact Us © animezone.co