提交后,AJAX保持在同一页面上,在同一页面上输出

时间:2016-05-07 05:53:18

标签: php jquery html ajax forms

我的HTML格式中有一些下拉列表:

<form name="fee" method="POST" action="">
<p><span class="title">Number of artists:</span>
    <select name="Number">
        <option value="" rel="none" selected disabled>Please select an option..</option>
        <option value="one" rel="one_art">One artist only</option>
        <option value="more" rel="more_arts">More than one artists</option>
</p>

单击提交按钮后,将生成一个夏日表。

<input type="submit" value="Calculate">

我的问题是:每当我点击按钮时,都会重置之前选择的选项。只有夏季出现在页面的末尾。有没有办法在同一页面上输出夏季而没有先前选择的选项被清除?

提前致谢!!

1 个答案:

答案 0 :(得分:0)

我认为您最好的选择是使用AJAX POST发布表单数据,并使用JQuery保持选择相同的选项:

   $(document).ready(function() {
                    $("#fee").on('submit',(function(e) {
                        e.preventDefault();
                        var selectedOption = $( "#Number option:selected" ).text();

                        $.ajax({
                           url: "here put the url to the php page handling your form data", 
                           type: "POST",
                           data: new FormData(this),
                           contentType: false,
                           cache: false,
                           processData: false,
                           success: function ()
                           {
                              $("#Number").val(selectedOption);

                           }
                        });
                    }
                });