Submit form checkbox value without page refresh Ajax php

Question

Still learning ajax.

Now i go stuck at this point.

Am trying to get the value of the checkbox on my form.

Below is my HTML code

<form method="post">
    <input type="text" name="mytext" id="text">
    <br>
    <input type="checkbox" name="test" id="agreed" value="check">
    <br>
    <input type="submit" id="form4" name="submit" value="Send">
    <p class="form-message"></p>
</form>

Below is my Ajax Script

$(document).ready(function() {
            $("#form4").click(function(event) {
              var action = 'another_test';
              var text = $("#text").val();
              var agreed = $("#agreed").val();
              event.preventDefault();
              $.ajax({
                type: "POST",
                url: "test3.php",
                data: {
                  mytext:text,
                  test:agreed,
                  action:action
                },
                success: function (response) 
           {
                  $(".form-message").html(response);
            }
              });
            });
      });

Then this is my PHP code below which is on a different page

<?php

if (isset($_POST['action']))
    {
        if ($_POST['action'] == 'another_test') {
            $test = $_POST["test"];
            $mytext = $_POST["mytext"];

            $errorEmpty = false;


            if (empty($mytext)) {
                echo "<p>enter your text</p>";
                $errorEmpty = true;
            }

            elseif (empty($test)) {
                echo "<p>Click the checkbox</p>";
                $errorEmpty = true;
            }

            else {
                echo "<p>Correct</p>";
            }
        } else {
            echo "Error.. cant submit";
        }
    }

?>
<script>

    var errorEmpty = "<?php echo $errorEmpty ?>";
</script>

It works for text, textarea input but not for checkbox. I know am wrong. Am still learning though.

Please help me. Thanks in advance.

Instead of a POST call you can use jquery function submit to submit the form api.jquery.com/submit — Nico Shultz
– Nico Shultz, Commented Nov 3, 2020 at 11:33
Why don't you just serialise the whole form like I showed you in my answer to your previous question? Then jQuery would be solving this problem for you automatically. (P.s. the underlying issue is that the value of a checkbox is different to whether it's checked or not) — ADyson
– ADyson, Commented Nov 3, 2020 at 11:40
@NicoSchultz that wouldn't cause an Ajax request though would it — ADyson
– ADyson, Commented Nov 3, 2020 at 11:41
Try -> $('#agreed').is(":checked") -> this return true or false depending checked or not — BhAvik Gajjar
– BhAvik Gajjar, Commented Nov 3, 2020 at 11:56

Esteban MANSART · Accepted Answer · 2020-11-03 12:02:19Z

3

Using $("#agreed").val() you only receive the value you setted in the "value" attribute on your input checkbox tag. To get a boolean value of checkbox's state you have to do use .is() function

$("#agreed").is(":checked");

answered Nov 3, 2020 at 12:02

Esteban MANSART

5613 silver badges12 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Everything good Over a year ago

This should work then am thinking i got am wrong in my php code? because it still not telling me if it was checked or not at my php. Thanks for trying. I appreciate

Esteban MANSART Over a year ago

Ok, i didn't see, your php. Now, because you always have a value (trueor false) you can't anymore use the empty() function ; use $test as boolean value instead

Everything good Over a year ago

Thanks for your help. But still doesn't work. It just for a learning purpose. probably an answer will show up someday

Collectives™ on Stack Overflow

Submit form checkbox value without page refresh Ajax php

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related