ajax post form when checkbox is changed jquery ajax not working

Question

i am trying to create a form submit when checkbox is changed my code is given below. . my problem is nothing happens on

gotofile.php

file but //dosomething on the sucess function is executed

the jquery:

$("#container input[type=checkbox]").change(function(e){
                if($(this).attr('checked')) 
                {

                    var cnType=$(this).attr("id");

                    $.ajax({
                        type: "POST",
                        url: "gotofile.php",
                        data: "typID="+cnType ,
                        cache: false,
                        success: function(){ 
                            //do something 
                        }
                    });
                }
            });

the php:

include '../dbconnection/dbconfig.php';


$typeID=$_POST['typID'];
$qryConnections="INSERT INTO ...";
$rslt1 = mysql_query($qryConnections);

the html

<form id="cnct" method="POST">
                            <div id="container" style="">
                                <ul style="list-style: none;">
                                   <li><input type="checkbox" id="1" />A</li>
                <li><input type="checkbox" id="2" />B</li>

                                </ul>
                            </div></form>

Can any one help me what i am doing wrong?

you might want to look at this answer too: http://stackoverflow.com/questions/901712/check-checkbox-checked-property-using-jquery — matpol, Jul 27 '12 at 07:23
i added the html code too my php inserts the values into the db — rzShrestha, Jul 27 '12 at 07:27
i am getting the checked value its working fine just the php post dosent work. am i doing something wrong in ajax because i checked gotofile putting dumy values it works fine — rzShrestha, Jul 27 '12 at 07:31

David Barker · Accepted Answer · 2012-07-27T07:45:24.567

A couple of security issues

Always keep in mind that your JS is viewable to anyone that navigates to your site. Using:

data : "typID="+cnType

Would make me think that typID is the field in your SQL. You have no CSRF filter, therefore I could write an ajax script to spoof valid requests and update all of your fields from an external location. Something to keep in mind, I recommend you read up on CSRF or Cross Site Request Forgery.

Why doesnt your script work

If the success function is firing, then the script has run. Debug it by outputing the value of $_POST['typID'] in your PHP. You will see the variables value in the console if it sent correctly.

As well as this it's always good to have your PHP echo out a JSON response for your success function to validate that all went well.

echo json_encode(array('response' => 'success'));

or ('response' => 'failed') or whatever you need. You can then evaluate the JSON in your success function.

I hope this helps.

thanx will see abt CSRF filter – rzShrestha Jul 27 '12 at 07:57 — rzShrestha, Jul 27 '12 at 07:57

Arun Jain · Answer 2 · 2012-07-27T07:32:24.357

0

The first thing is you should use click instead of change event for the checkbox in your Jquery code.

The second thing, you did not provide any value to the checkbox in your html code.

Kindly ask if it not worked for you.

edited Jul 27 '12 at 07:32

answered Jul 27 '12 at 07:20

Arun Jain

5,476
2
31
52

check in firebug whether ajax request is being sent or not? – Arun Jain Jul 27 '12 at 07:33

score 0 · Answer 3 · answered Jul 27 '12 at 07:47

Try

        $("#container input[type='checkbox']").click(function(e){

                var cnType=$(this).attr("id");

                $.ajax({
                    type: "POST",
                    url: "gotofile.php",
                    data: "typID="+cnType ,
                    cache: false,
                    success: function(){ 
                        //do something 
                    }
                });
         });

ajax post form when checkbox is changed jquery ajax not working

3 Answers3