12 Replies - 426 Views - Last Post: 29 December 2016 - 02:45 PM

#1 ratonhnaketon  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 48
  • Joined: 07-January 16

Check a CheckBox with Jquery

Posted 29 December 2016 - 05:00 AM

hello. i have a html like this :

<tr> 
<td>                
  <input type="checkbox">
</td>
<td>example</td>
<td>new test</td>
</tr> 



i want to click on the "tr" and check the checkbox.
my jquery code to do this is :

$("tr").click(function() {
  var checkbox = $("tr input");
  if(checkbox.is(":checked")) {
    this.prop('checked', 'false');
  }
  else {
    this.prop('checked', 'true');
  }
});



it does not work at all.
i'm newbie to jquery so please help me !

This post has been edited by ratonhnaketon: 29 December 2016 - 05:01 AM


Is This A Good Question/Topic? 0
  • +

Replies To: Check a CheckBox with Jquery

#2 andrewsw  Icon User is online

  • say what now
  • member icon

Reputation: 6409
  • View blog
  • Posts: 25,903
  • Joined: 12-December 12

Re: Check a CheckBox with Jquery

Posted 29 December 2016 - 05:51 AM

Are there errors in your browser's console?
Was This Post Helpful? 1
  • +
  • -

#3 ratonhnaketon  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 48
  • Joined: 07-January 16

Re: Check a CheckBox with Jquery

Posted 29 December 2016 - 05:58 AM

View Postandrewsw, on 29 December 2016 - 05:51 AM, said:

Are there errors in your browser's console?


NO there isn't.
Was This Post Helpful? 0
  • +
  • -

#4 astonecipher  Icon User is offline

  • Too busy for this
  • member icon

Reputation: 2342
  • View blog
  • Posts: 9,393
  • Joined: 03-December 12

Re: Check a CheckBox with Jquery

Posted 29 December 2016 - 07:55 AM

I think you should check again. If there are not error showing, something is wrong.
Was This Post Helpful? 1
  • +
  • -

#5 ratonhnaketon  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 48
  • Joined: 07-January 16

Re: Check a CheckBox with Jquery

Posted 29 December 2016 - 08:33 AM

View Postastonecipher, on 29 December 2016 - 07:55 AM, said:

I think you should check again. If there are not error showing, something is wrong.



there is this Warning :
jQuery.Deferred exception: cells[i].val is not a function TypeError: cells[i].val is not a function
    at HTMLdocument.<anonymous> (http://vahedyar.ir/assets/js/scripts.js:23:17)
    at mightThrow (http://vahedyar.ir/assets/js/jquery.js:3505:29)
    at process (http://vahedyar.ir/assets/js/jquery.js:3573:12) undefined



But it's not related to this part. it's about another part of code.
Was This Post Helpful? 0
  • +
  • -

#6 astonecipher  Icon User is offline

  • Too busy for this
  • member icon

Reputation: 2342
  • View blog
  • Posts: 9,393
  • Joined: 03-December 12

Re: Check a CheckBox with Jquery

Posted 29 December 2016 - 08:47 AM

If there is an error found in JS, it stops executing. However, there are some errors in what you posted as well.
Was This Post Helpful? 0
  • +
  • -

#7 astonecipher  Icon User is offline

  • Too busy for this
  • member icon

Reputation: 2342
  • View blog
  • Posts: 9,393
  • Joined: 03-December 12

Re: Check a CheckBox with Jquery

Posted 29 December 2016 - 12:51 PM

A little help,

$("tr").click(function() {
    var checkbox = $(this).find('input[type="checkbox"]');


However, that won't work until you get the other Javascript issues worked out.
Was This Post Helpful? 1
  • +
  • -

#8 ratonhnaketon  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 48
  • Joined: 07-January 16

Re: Check a CheckBox with Jquery

Posted 29 December 2016 - 12:56 PM

View Postastonecipher, on 29 December 2016 - 12:51 PM, said:

A little help,

$("tr").click(function() {
    var checkbox = $(this).find('input[type="checkbox"]');


However, that won't work until you get the other Javascript issues worked out.


Do "Warnings" Stop js from Executing too ?
Was This Post Helpful? 0
  • +
  • -

#9 ratonhnaketon  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 48
  • Joined: 07-January 16

Re: Check a CheckBox with Jquery

Posted 29 December 2016 - 01:02 PM

Now this is my code :
$("tr").click(function() {
  var checkbox = $(this).find('input[type="checkbox"]');
  if(checkbox.is(":checked")) {
    $(this).prop('checked', 'false');
  }
  else {
    $(this).prop('checked', 'true');
  }
});




there isn't any warnings or errors in the console and the code is still not working !
Was This Post Helpful? 0
  • +
  • -

#10 astonecipher  Icon User is offline

  • Too busy for this
  • member icon

Reputation: 2342
  • View blog
  • Posts: 9,393
  • Joined: 03-December 12

Re: Check a CheckBox with Jquery

Posted 29 December 2016 - 01:07 PM

Pretty sure that isn't what i put. And I don't think you know what $(this), references.
Was This Post Helpful? 1
  • +
  • -

#11 ratonhnaketon  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 48
  • Joined: 07-January 16

Re: Check a CheckBox with Jquery

Posted 29 December 2016 - 01:45 PM

View Postastonecipher, on 29 December 2016 - 01:07 PM, said:

Pretty sure that isn't what i put. And I don't think you know what $(this), references.


You Were Wright ! i updated my code and it works ! but only once and only for checking! not unchecking!

$('body').on("click", "tr", function(event) {

  var target = $(event.target);
  if (target.is('input:checkbox')) return;
  var checkbox = $(this).find("input[type='checkbox']");
  if( checkbox.is(":checked") ){
    checkbox.attr("checked","false");
  } else {
    checkbox.attr("checked","true");
  }

});



any other help ?
Was This Post Helpful? 0
  • +
  • -

#12 astonecipher  Icon User is offline

  • Too busy for this
  • member icon

Reputation: 2342
  • View blog
  • Posts: 9,393
  • Joined: 03-December 12

Re: Check a CheckBox with Jquery

Posted 29 December 2016 - 02:01 PM

attr adds an attribute, it won't remove it.

		(function() {
			$("tr").click(function() {
				var checkbox = $(this).find('input[type="checkbox"]');
				if (checkbox.is(":checked")) {
					console.log('unchecked')
					checkbox.prop('checked', true)
				} else {
					console.log('checked')
					checkbox.prop('checked', false)
				} 
			});
		}());


Was This Post Helpful? 0
  • +
  • -

#13 astonecipher  Icon User is offline

  • Too busy for this
  • member icon

Reputation: 2342
  • View blog
  • Posts: 9,393
  • Joined: 03-December 12

Re: Check a CheckBox with Jquery

Posted 29 December 2016 - 02:45 PM

Swapped some values that made it fail.
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1