Jquery Checkboxes not working

Question

Hello Guys yesterday I asked a queestion and since then i changed my code quiete a bit. So right now i am trying to get some Javascript working if a specific checkboxes is getting checked. But right now it is happening nothing when i check the checkbox. Can anybody help my out with this I am fairly new to Jquery and Javascript and i am a little bit overstrained. So here is my Javascript-Code:

<script type="text/javascript" charset="UTF-8">

$('#checkbox1').get(0).checked(function(){  
    $(document).bind('deviceready', function(){
        onDeviceReady();
    });
    function yourCallback(button) {
        if (button == 2) {
            dataRequest();
        }
    }
    function dataRequest() {
        var output = $('#output').text('Loading data...');
        $.ajax({
            url: 'exampleURL/connect_neu.php',
            dataType: 'jsonp',
            jsonp: 'jsoncallback',
            timeout: 5000,
            success: function(data, status){
                output.empty();
                $.each(data, function(i,item){

                var ort = '<table border="solid" width="30%" border-collapse="collapse">'+'<tr>'+'<td>'+item.abfahrt+'</td>'
                + '<td>'+item.rueckfahrt+'</td>'
                + '<td>'+item.StartOrt+'</td>'
                + '<td>'+item.Zielort+'</td>'+'</tr>'
                + '</table>';
                output.append(ort);
                });
            },
            error: function(){
                output.text('There was an error loading the data.');
                navigator.notification.confirm(
                    'Something went wrong. Would you like to retry?',
                    yourCallback,
                   'Error',
                    'No,Yes'
                );
            }
        });
    } 
    dataRequest();
});

</script>`enter code here`

and here are my checkboxes in HTML:

    <form name="checkboxes" action="" id="checkboxes">
    <span class="anchor">Fahrten</span>
    <ul class="items">
        <li><input id="checkbox1"  type="checkbox" name="zukuenftig" value="1">zuk&uuml;nftige Fahrten</li>
        <li><input id="checkbox2" type="checkbox" name="vergangen" value="2">vergangene Fahrten</li>
        <li><input id="checkbox3" type="checkbox" name="alle" value="3">alle Fahrten</li>
        <li><input type="button" value="Go" onclick="Weiter()"></li>
    </ul>

</form>

score 0 · Answer 1 · answered Jan 05 '15 at 09:14

0

Make sure you have your script in the document ready, otherwise your checkboxes could be created after you run your jquery code.

http://api.jquery.com/ready/

answered Jan 05 '15 at 09:14

Luis Tellez

2,785
1
20
28

So i just put $(document).ready(function(){ above my other code? – FabianE Jan 05 '15 at 09:18
@FabianE: Exactly. And remember to properly close the brackets. – briosheje Jan 05 '15 at 09:20

score 0 · Answer 2 · edited Jan 05 '15 at 09:29

0

Use checkbox change event in document.ready like this :-

$(document).ready(function(){
   $('#checkbox1').change(function(){ 
      if($(this).is(':checked')){
        //your code goes here
      }
   });
});

instead of $('#checkbox1').get(0).checked(function(){

see example: FIDDLE DEMO

edited Jan 05 '15 at 09:29

Rakesh Shetty

4,548
7
40
79

answered Jan 05 '15 at 09:26

Ankit Sahrawat

1,306
1
11
24

score 0 · Answer 3 · edited May 23 '17 at 10:30

.checked is a boolean property, not a function.

You may want something like this instead:

$('#checkbox1').change(function () {
    if (this.checked) {
        // ...
    }
});

A discussion of such solutions is available here: jQuery checkbox checked state changed event

If you open your JavaScript console you would have seen an error along the lines of:

Uncaught TypeError: boolean is not a function

Here are instructions for viewing it in different browsers: https://webmasters.stackexchange.com/questions/8525/how-to-open-the-javascript-console-in-different-browsers

Jquery Checkboxes not working

3 Answers3