How to Get Checkbox Variables Using Ajax

Get checkbox value in a variable in Ajax

that's wrong.
To get if a checkbox is checked or not you should do like this:

 $('#<%=myCheckBox.ClientID %>').prop( "checked" )

Reference: jQuery Doc

How to get checkbox value in AJAX

Yeah Deckerz is right normally you have an ajax call which has a 'Data' option and then a success option. The data is an array/object of values that you want to send.

There are lots of options on the jquery ajax page and it's quite easy to get lost in them. This though is the norm. Done is called after some.php (in this case) has finished and msg has the data that is sent back from msg. Normally you'll want this in a json format. This is good practise for if you want to send back 2 variables. e.g Status (success/error) and ErrorMessage = ""

if you're using php json_encode is the function to use to achieve this.

$.ajax({
  method: "POST",
  url: "some.php",
  data: { name: "John", location: "Boston" }
})
  .done(function( msg ) {
    alert( "Data Saved: " + msg );
  });

Receiving Checkbox Values Using Ajax

A couple suggestions...

For one, avoid using duplicate id="checkboxes" attributes, for example by using use name="checkboxes":

{% for member in team_profile %}
    <div class="checkbox">
        <label> <input type="checkbox" name="checkboxes" value="{{ member.user_id }}">{{ member.first_name }}</label>
    </div>
{% endfor %}

Also, the correct way to add data to an array is by using myCheckboxes.push(...):

var myCheckboxes = new Array();
$("input:checked").each(function() {
    myCheckboxes.push($(this).val()); // changed this line
});

$.ajax({
    type:'POST',
    url:'createEvent/',
    data:{
        name: name,
        myCheckboxes: myCheckboxes,
    }
});

Lastly, get the values on the server as follows:

def createEvent(request):
    if request.method == "POST":
        member = request.POST.getlist('myCheckboxes[]')
        print(member)

how to grab value from checkbox and input with jquery ajax

So you can do that in this way

<input type="text" class="text" value="" />

Your jquery

$('.values').click(function(){  
       var checkboxes_value = []; 
        var inputval=$(".text").val();//getting value of input field
       $('.cb').each(function(){  
            //if($(this).is(":checked")) { 
            if(this.checked) {              
                 checkboxes_value.push($(this).val());                                                                               
            }  
       });                              
       checkboxes_value = checkboxes_value.toString(); 

       $.ajax({  
            url:"",  
            method:"POST",  
            data:{ checkboxes_value:checkboxes_value,inputval:inputval},  
            success:function(data){  
                 $('.echo').html(data);  
            }  
       });  
    });

Your php code

if(isset($_POST["checkboxes_value"]) && isset($_POST["inputval"]) ) {  
  $result = $_POST["checkboxes_value"];  
  echo  '<br />'.$result.'<br />';
echo  '<br />'.$_POST["inputval"].'<br />';
} 

Get input checkbox values in php after ajax

I think is more simple.

 $(document).ready(function () {
            $('.add-item').submit(function (event) {
                var data = $('.add-item').serialize(); // send all the form data
                console.log(data); // for debug only
                $.ajax({
                    type: 'post',
                    url: 'form_ajax.php',
                    data: data,
                }).done(function (data) {
                    console.log(data); // response from server via ajax
                });
                event.preventDefault(); // prevent submit
            });
        });

With this manner you send all the form. Nothing changes even if you send 1 or 20 values.

Problem collecting the checkbox value using AJAX and PHP

You can simplify your code quite a bit. If you just want to pass the state of the checkbox, you only need:

Instead of your checkMark() function, just check it in the submit callback.

// This will set the value 1 if it is checked and 0 if it isn't.
var checkBox = document.getElementById("spouse");
var type = {
    'spouse' : checkBox.checked ? 1 : 0 
}

// Don't stringify the object, just pass it as is. jQuery will take care if it.
$.ajax({
    ...
    data: type,
    ...

---

Related Topics