jQuery Form Doesn't Post

Need Help
100

I recently answered a laracast question on this, it’s a put request however:

    <script>
        $(document).ready(function () {
            $("#submitBtn").click(function (event) {
                event.preventDefault();
                var $post = {};
                $post.petid = $('#petid').val();
                $post.species = $('#species').val();
                $post.sex = $('#sex').val();
                $post._token = document.getElementsByName("_token")[0].value;
                $post._method = document.getElementsByName("_method")[0].value;
                alert($post.species);
                var url = '<?= DIR . "pet/petupdate" ?>';
                var result =
                        $.ajax({
                            type: "PUT",
                            url: url,
                            data: $post,
                            dataType: "json"
                        })
                        .done(function (data, textStatus, jqXHR) {
                            //alert(data);
                            alert("in jquery");
                            alert(JSON.stringify(data));
                            myData(data);
                        })
                        .fail(function (jqxhr, status, error) {
                            alert("failed");
                            showData(jqxhr.status, jqxhr.responseText);
                        });

            }); 
});

        const myData = (data) => {
            var div = document.getElementById("msg");
            for (var key in data) {
                div.innerHTML += "--- " + data[key];
            }
        };


        function showData(status, data)
        {
            var div = document.getElementById("msg");
            alert("data is---" + data);
            var data = JSON.parse(data);

            if (status === 422) {
                for (var key in data) {
                    div.innerHTML += "--- " + data[key];
                }
            }

        }

</script>

Just adapt to cake.  Bit I suggest axios js.

**AXIOS

        document.getElementById('submitBtn').addEventListener('click', submitPost);
        async function submitPost(e) {
            e.preventDefault();
            alert("here async");
            const $post = {petid: document.getElementById('petid').value,
                species: document.getElementById('species').value,
                sex: document.getElementById('sex').value,
                _token: document.getElementsByName("_token")[0].value,
                _method: document.getElementsByName("_method")[0].value};
            const url = '<?= DIR . "pet/petupdate" ?>';
           try {
                const response = await axios.put(url, $post);
                var data = response.data;
                showData(data);
            } catch (error) {
                if (error.response) {
                    //isJson(error.response.data);
                    showData(error.response.data);
                }
            }
        }


        function showData(data) {
            var div = document.getElementById('msg');
            document.getElementById("msg").style.display = "block";
            for (var key in data) {
                div.innerHTML += " " + data[key];
            }
        }