Check if a checkbox is checked not working

[D3V4]

I have a checkbox with value "tipo". I would like to check if it's checked or not. This is the script, which is not working:

$(function() {
	
	if($('input[value=tipo]').is(':checked]')) {
		alert('asd');
	}
	
})

Where is the error?

[paul_wilkins]

Where is the error?

The script will check only once, when the page is loaded. Is that what you're after?

Also, on the attribute equals selector documentation page, you'll see that the value is contained within double quotes. That might have something to do with the problem you're facing.

[D3V4]

The script will check only once, when the page is loaded. Is that what you're after?

No, I want to check it constantly.

Also, on the attribute equals selector documentation page, you'll see that the value is contained within double quotes. That might have something to do with the problem you're facing.

I've always used it without quotes, I thought it was correct this way...

[paul_wilkins]

No, I want to check it constantly.

Then you will want to attach a click event to the checkbox. Something like this should do the trick:

$(function() {
    $(':checkbox[value="tipo"]').click(function () {
        if ($(this).is(':checked')) {
            alert('asd');
        }
    });
});

I've always used it without quotes, I thought it was correct this way...

Not officially, no.

The attribute selector page says:

Attribute values in selector expressions must be surrounded by quotation marks.

And yes, the bold piece is straight from their page too.

[D3V4]

Then you will want to attach a click event to the checkbox. Something like this should do the trick:

$(function() {
    $(':checkbox[value="tipo"]').click(function () {
        if ($(this).is(':checked')) {
            alert('asd');
        }
    });
});

This worked, thank you

Not officially, no.

The attribute selector page says:

Attribute values in selector expressions must be surrounded by quotation marks.

And yes, the bold piece is straight from their page too.

Thanks

[paul_wilkins]

What if I want to bind the click event to every checkbox on the page?

You know how this selects the checkbox with a value of tipo?

$(':checkbox[value="tipo"]')

What change do you think you would need to make to it?

[D3V4]

You know how this selects the checkbox with a value of tipo?

$(':checkbox[value="tipo"]')

What change do you think you would need to make to it?

Dumb question, that's why I've deleted it immediately.

My questions actually meant how i could go through all the checkboxes and do different things based on the name of the checkbox. I've done it like this:

$(function() {
	
	$(':checkbox').click(function() {
		if ($(this).is(':checked')) {
			var colonna = $(this).attr("value");
			$('#'+colonna).show();
			$('.'+colonna).show();
		} else {
			var colonna = $(this).attr("value");
			$('#'+colonna).hide();
			$('.'+colonna).hide();
		}
	})
		
	
})

[D3V4]

A question that came up to my mind right now: is there an event that I can use to see if a checkbox is checked or unchecked by another javascript file and not by a user?

[paul_wilkins]

A question that came up to my mind right now: is there an event that I can use to see if a checkbox is checked or unchecked by another javascript file and not by a user?

The elements' click event will trigger no matter where the change is coming from.

[D3V4]

Thanks for the suggestions, although I must say that I find the first version of the code easier to understand

Do you have an answer for my last question too?

[D3V4]

I must have a problem with my scripts though. I have a script that checks or unchecks all the checkboxes (after clicking on a link) and another script that shows the correspondent column if the checkbox is checked, or hides it otherwise.

If I uncheck a checbox manually, the column is hidden. If I make the script check all the checkboxes (clicking on the link), all the checkboxes become checked but the one I had unchecked previously remains hidden, even if it's now checked.

I don't know if I've made my point clear here thanks for all your help, by the way

[paul_wilkins]

I must have a problem with my scripts though.

Perhaps not, and perhaps I wasn't being clear enough in my response.

What I was meaning to say is that it doesn't matter where the click event comes from. A person can click on the checkbox, or a script can trigger the click event on the checkbox. Whether by user or scripted command, it is the same event that is run.

I have a script that checks or unchecks all the checkboxes (after clicking on a link) and another script that shows the correspondent column if the checkbox is checked, or hides it otherwise.

If you are directly editing the checked property of the checkbox, then that won't trigger the click event. Instead of directly editing that value, first investigate to find out if it is checked or not. If it's not in the correct state, trigger the click event on that checkbox and that should get you closer to a solution.

[D3V4]

If you are directly editing the checked property of the checkbox, then that won't trigger the click event. Instead of directly editing that value, first investigate to find out if it is checked or not. If it's not in the correct state, trigger the click event on that checkbox and that should get you closer to a solution.

I don't understand what you mean with the part in bold.

[paul_wilkins]

I don't understand what you mean with the part in bold.

You can see an example on the jQuery trigger documentation page.

[D3V4]

You can see an example on the jQuery trigger documentation page.

Ok, now I'm not editing the property value but I'm using trigger to launch the click event, but it still isn't working.

I mean, the checkbox becomes checked but the script that should run after a click event is not executed.

[centered effect]

I am confused, why wouldn't/doesn't this work?

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<form>
    <input type="checkbox" value="Bike" /> I have a bike
    <input type="checkbox" value="Car" /> I have a car
    <input type="checkbox" value="Skateboard" /> I have a skateboard
</form> 
<script>
    $('input:checkbox').click(function() {
        if ($(this).is(':checked')) {
            alert($(this).val());
        }
    });
</script> 

[D3V4]

I am confused, why wouldn't/doesn't this work?

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<form>
    <input type="checkbox" value="Bike" /> I have a bike
    <input type="checkbox" value="Car" /> I have a car
    <input type="checkbox" value="Skateboard" /> I have a skateboard
</form> 
<script>
    $('input:checkbox').click(function() {
        if ($(this).is(':checked')) {
            alert($(this).val());
        }
    });
</script> 

This does work, it's this that doesn't:

$('input:checkbox').trigger('click');

The code that should be executed isn't, even if the click event has been triggered.

[centered effect]

Sorry, I didn't read the whole thread, now that I did, more information is needed (site, addtl code, etc)

[D3V4]

Sorry, I didn't read the whole thread, now that I did, more information is needed (site, addtl code, etc)

I would need too much time to set up a testing environment, I am ready to do some screen sharing though.

[D3V4]

Ok, I've prepared a small test folder with a simple HTML page and all the Javascript that I use: test.zip

To make the problem happen: click on the checkbox "Tipo" to hide the column with the same name. Click on it again to show it again. Up to this point everything works. Now click on it again to hide it and then click on "Espandi la tabella". You can see that the checkbox is being checked again but the column remains hidden.

Thank you very much in advance for your help!

[paul_wilkins]

Clicking on Espandi causes the Tipo section to show, but the checkbox becomes unticked. When you then check the Tipo checkbox, it tries to show the Tipo section but it's already shown, so you get the impression that nothing has happened. When you uncheck the Tipo checkbox it hide again.

It seems that all of the checkboxes have been told to be the complete opposite of what they should be.

[D3V4]

LOL I just realized that this is not the exact behavior that I get in my local testing environment XD Here, if I click on Espandi the checkbox remains ticked.

Anyway, how do you suggest I solve this problem?

Edit: I've created a test account on an actual running online version, so show you how the behavior of the script is different. Go to http://domus.danielpellarini.com and login using the credentials "test" "test".

You can see here that clicking on Espandi ticks or unticks the checkboxes correctly, but still, if you go through the steps that I've written above to make the problem show, the column is not shown again if you click on Espandi after hiding it.

[paul_wilkins]

I suggest that you first get the checkboxes to corresponding with the visible columns.

Once you do that, we can move on to other issues that may remain.

[D3V4]

I suggest that you first get the checkboxes to corresponding with the visible columns.

Once you do that, we can move on to other issues that may remain.

It works correctly in the online version.

[paul_wilkins]

It works correctly in the online version.

So we ask, what is different in the script, between the two versions?