Question

我正在尝试构建的函数将获得用户选择的日期（使用Bootstrap datepicker对象）。单击“提交”按钮后，它将调用从.csv文件读取数据的Javascript函数，并根据用户选择的日期构建表。

现在一切正常，但我无法弄清楚如何将所选日期传递给函数。（我还是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对此有好处（＆＃34;进入dom＆＃34;）。

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

Answer 2

通过查看文档https://bootstrap-datepicker.readthedocs.io/en/latest/methods.html#getdate，您只需要这样做。

var theDate = $("#date").datepicker("getDate");

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

2 个答案: