javascript - 将日期参数从 HTML 传递到使用 AJAX 的 Javascript 函数

Question

我尝试构建的函数将获取用户选择的日期(使用 Bootstrap 日期选择器对象)。单击“提交”按钮后，它将调用 Javascript 函数，该函数从 .csv 文件中读取数据并根据用户选择的日期构建表格。

现在一切正常，但我不知道如何将选定的日期传递到函数中。 (我对 HTML/JavaScript 还是个新手)

这是我的 HTML:

    <div class="bootstrap-iso">
        <div class="container-fluid">
            <div class="row">
                <div class="col-md-3 col-sm-2 col-xs-3">

                <!-- Form code begins -->
                <form method="post">
                <div class="form-group"> <!-- Date input -->
                    <label class="control-label" for="date">Select Schedule Date:</label><br>
                    <input class="form-control" id="date" name="date" placeholder="MM/DD/YYY" type="text"/><br>


                <div class="form-group"> <!-- Submit button -->
                    <div class="container">
                        <div class="table-responsive">
                            <div>
                                <input type="button" name="load_data" id="load_data" class="btn btn-info" value="Submit">
                            </div><br>
                            <div id="aspera_val"></div>                    
                        </div>
                    </div>        
                </div>
                </div>
                </form>
                 <!-- Form code ends --> 

                </div>
            </div>    
        </div>
    </div>

这是我构建的 Javascript:

$(document).ready(function(){
$('#load_data').click(function (){
    $.ajax({
        type:"GET",
        url:"aspera_validation.csv",
        datatype:"text",
        success:function(data)
        {
            // new row for each endline 
            var aspera_data=data.split(/\r?\n|\r/);                
            // set table type
            var table_data = '<table class="table table-bordered table-striped table-hover">';                
            for (var count = 0; count < aspera_data.length; count++)
            {
                // new column for each ","
                var cell_data = aspera_data[count].split(",");

                // 
                table_data += '<tr>';
                for (var cell_count = 0; cell_count < cell_data.length; cell_count++)
                {
                    // create header cells for first row
                    if (count === 0)
                    {
                        table_data += '<th>' + cell_data[cell_count] + '</th>';
                    }
                    // cell data for every other row
                    else
                    {    
                            table_data += '<td>' + cell_data[cell_count] + '</td>';
                    }
                }
                table_data += '</tr>';
            }
            table_data += '</table>';
            $('#aspera_val').html(table_data);
        }
    });
});

});

现在，当我点击提交按钮时，它只是从 csv 文件生成整个表格，基本上忽略了日期。我已经尝试了一堆不同的配置来放置日期参数，但还没有想出任何有效的方法。感谢您提供的任何帮助!

Answer 1

最简单的方法是在成功函数中获取日期字段的值。 jQuery 对此很有帮助(“深入到 dom”)。

var myDate = $('[name="date"]').val()