带有日期和日期名称的表

Question

我正在尝试制作某种“时间表”，用户在其中输入 2 个日期

它计算每个月/年并显示在combobox。

我想动态（无需刷新页面或任何内容）更新天数并用Day Number 和Day Name(monday,etc..) 填写表格

我设法计算了一个月的天数，但是如何在不重新加载页面的情况下显示我的表格？

也许我应该在 Ajax 中使用 JSON 数组？但是我该如何实现呢？

JavaScript

$(document).ready(function() {
$('#dates').change(function() {
    var splitDate = $('#dates').val().split("/");
    var month = splitDate[0];
    var year = splitDate[1];
    var days = daysInMonth(month,year);
    alert(days);
});

function daysInMonth(month,year) {
    return new Date(year, month, 0).getDate();
}

});

HTML

<div class="row" style="margin-top: 30px;">
            <div class="table-responsive">
                <table class="table">
                    <thead>
                    <tr>
                        <th class="text-center">#</th>
                        <th class="text-center">Day</th>
                        <th class="text-center">Number of Clients</th>
                        <th class="text-center"></th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr class="text-center">
                        <td></td>
                        <td></td>
                        <td><input name="amountOfClients[]" type="number"></td>
                        <td>
                        </td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>

Answer 1

您想从表中删除所有当前行并插入新行吗？

如果是，请尝试以下步骤：

1) 为 tbody 分配 id (tbodyid)

2) 在日期更改事件中调用函数（称为 new_data()）。

3) 在该函数中首先删除所有当前行 $("#tbodyid").empty();

4) 使用循环并为要添加到变量中的表创建表

（取决于您的数据使用循环或单独添加每一行）

var new_rows="";
// data 
var count=Object.keys(data).length;
for(i=0; i< count ; i++)
{
   new_rows=new_rows+"<tr>"
                   +" <td>"+i+"</td>"
                   +" <td>"+data['day']+"</td>"
                      +"  <td><input name='amountOfClients[]' type='number'>"+data['noOfClient']+"</td>"
                       +" <td> </td>"; 
}

5) 将新行追加到 tbody id by

$("#tbodyid").append(new_rows);