Ajaxのみでフォームを作って要素をPOSTで送る - Jquery

やりたいこと

ボタンをクリックすると、Jqueryが発火する。

<button id="ajax-button">

$('#ajax-button').click( 

　んで、その中で、フォームを作って、フォームの値を作って、POSTリクエストを飛ばす。

ソース

                                                <button id="ajax-button">go</button>
                                                <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
                                                <script>
                                                    $('#ajax-button').click(
                                                   
                                                    function() {
                                                        var hostUrl= '/completecart';
                                                        var param1 = $("#product_count").attr('value');
                                                        var param2 = $("#product_price").attr('value');
                                                        var product_name = $("#product_name").attr('value');
                                                        var product_image = $("#product_image").attr('value');
                                                        
                                                        alert(param1)
                                                        $.ajax({
                                                            url: hostUrl,
                                                            type:'POST',
                                                            dataType: 'json',
                                                            data : {parameter1 : param1, parameter2 : param2, product_name : product_name, product_image : product_image },
                                                            timeout:3000,
                                                        }).done(function(data) {
                                                        }).fail(function(XMLHttpRequest, textStatus, errorThrown) {
                                                        })
                                                    });
                                                </script>

Tweet

Pocket

Share on Tumblr