每次更改日期时的Ajax请求

我尝试创建ajax，每次更改日期时发送日期，并将响应放入html中，然后如果所有输入都已发送，则提交。如何创建脚本，该脚本在字段发生更改时侦听字段

<form class="form-horizontal" action="" method="post">
            <fieldset>
                <legend></legend>

                <div class="form-group">
                    <label class="col-sm-4 control-label" for="reservation_Date">Date</label>
                    <div class="col-sm-6">
                        <input type="date" class="form-control" id="reservation_Date"
                               name="reservation[date]">
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-4 control-label" for="reservation_Time">Time</label>
                    <div class="col-sm-6">
                        <input type="time" class="form-control" id="reservation_Time"
                               name="reservation[time]">
                    </div>
                </div> 
                <div class="form-group">
                    <div class="col-sm-4 col-sm-offset-4">
                        <a class="btn btn-default" href="">Cancel</a>
                        <button type="submit" class="btn btn-primary">Create Reservation!</button>
                    </div>
                </div>
                <hr>
                <button type="button" onclick="loadDoc()">Request data</button>

                <p id="reserved"></p>

                <script>

                    function loadDoc() {
                        var Date = $('#reservation_date').val();
                        var xhttp = new XMLHttpRequest();
                        xhttp.onreadystatechange = function() {
                            if (this.readyState == 4 && this.status == 200) {
                                document.getElementById("reserved").innerHTML = this.responseText;
                            }
                        };
                        xhttp.open("POST", "/create", true);
                        xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
                        xhttp.send(Date);
                    }
                </script>
            </fieldset>
        </form>

日期
时间
创建预订！

请求数据

函数loadDoc（）{
变量日期=$（“#预订日期”）.val（）；
var xhttp=newXMLHttpRequest（）；
xhttp.onreadystatechange=函数（）{
if（this.readyState==4&&this.status==200）{
document.getElementById（“保留”）.innerHTML=this.responseText；
}
};
xhttp.open（“POST”、“/create”、true）；
setRequestHeader（“内容类型”，“应用程序/x-www-form-urlencoded”）；
xhttp.send（日期）；
}

我尝试使用这个脚本，并将其添加到输入onchange=“mySubmit（this.dateTime）”中，现在当我更改日期时，再次给我相同的表单

<script>
                    function mySubmit(reservation_Date) {
                        $.ajax({ // create an AJAX call...
                            data: $("reservation_Date").serialize(), // get the form data
                            type: $(reservation_Date).attr("POST"), // GET or POST
                            url: $(reservation_Date).attr("/create"), // the file to call
                            success: function (response) { // on success..
                                $('#demo').html(response); // update the DIV
                            }
                        });
                    }
                </script>

函数mySubmit（预订日期）{
$.ajax（{//创建一个ajax调用。。。
数据：$（“保留日期”）.serialize（），//获取表单数据
类型：$（预订日期）.attr（“POST”），//获取或发布
url:$（预订日期）.attr（“/create”），//要调用的文件
成功：函数（响应）{//on success。。
$（'#demo'）.html（响应）；//更新DIV
}
});
}

我找到了解决方案

onchange="mySubmit(this.input)"

<script>
            function mySubmit() {
                var Date = document.getElementById("reservation_Date").value;
                var xhttp = new XMLHttpRequest();
                xhttp.onreadystatechange = function() {
                    if (this.readyState == 4 && this.status == 200) {
                        document.getElementById("demo").innerHTML = this.responseText;
                    }
                };
                xhttp.open("POST", "/check", true);
                xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
                xhttp.send(Date);
            }
        </script>

onchange=“mySubmit（this.input）”
函数mySubmit（）{
var Date=document.getElementById（“预订日期”）.value；
var xhttp=newXMLHttpRequest（）；
xhttp.onreadystatechange=函数（）{
if（this.readyState==4&&this.status==200）{
document.getElementById（“demo”）.innerHTML=this.responseText；
}
};
xhttp.open（“POST”、“/check”、true）；
setRequestHeader（“内容类型”，“应用程序/x-www-form-urlencoded”）；
xhttp.send（日期）；
}

你应该接受这个答案，除非你也在寻找“更好”的答案，如果是这样的话，请加上一条说明。