.net core MVC Month schedule dropdownlist for Year and month, below value will change based on selected year and month for using entityframework

Question

我的代码是这样的Link:() 我想添加像这个图像的功能（https://drive.google.com/file/d/1ucjmRjnXIltr7mvrtWeGweSg9PZT4QGo/view） 在我看来，我添加年和月。

                       <td>
                            <div asp-validation-summary="ModelOnly" class="text-danger"></div>
                            <div class="form-group">
                                <input name=PunchIn[@(day-1)].Year asp-for="Year" class="form-control" value=@year readonly="readonly" />
                                <span asp-validation-for="Year" value="@year" class="text-danger"></span>
                            </div>
                        </td>
                        <td>
                            <div class="form-group">
                                <input name=PunchIn[@(day-1)].Month asp-for="Month" class="form-control" value=@month readonly="readonly" />
                                <span asp-validation-for="Month" value="@month" class="text-danger"></span>
                            </div>
                        </td>

如何添加年份和月份下拉列表？从前端更改视图或更改控制器（后置）是否有更好的方法？当我select年和月时，从某月的第一天到最后一天左右年和月的值会同步变化。另外，在提交表单时，我可以将我填写的表单存储到数据库中。

这是我的带有月份和年份的下拉列表： 但是，当我添加视图时，它会显示失败。我该如何添加它来解决上述问题？或者还有其他更好的方法？谢谢。

var years = new List<SelectListItem>();
    for (var i = 2020; i <= 2042; i++)
    {
        years.Add(new SelectListItem { Text = i.ToString(), Value = i.ToString(), Selected = Model.Year == i });
    }

 var months = new List<SelectListItem> {
        new SelectListItem {Text = "1", Value = "1", Selected = Model.Month == 1},
        new SelectListItem {Text = "2", Value = "2", Selected = Model.Month == 2},
        new SelectListItem {Text = "3", Value = "3", Selected = Model.Month == 3},
        new SelectListItem {Text = "4", Value = "4", Selected = Model.Month == 4},
        new SelectListItem {Text = "5", Value = "5", Selected = Model.Month == 5},
        new SelectListItem {Text = "6", Value = "6", Selected = Model.Month == 6},
        new SelectListItem {Text = "7", Value = "7", Selected = Model.Month == 7},
        new SelectListItem {Text = "8", Value = "8", Selected = Model.Month == 8},
        new SelectListItem {Text = "9", Value = "9", Selected = Model.Month == 9},
        new SelectListItem {Text = "10", Value = "10", Selected = Model.Month == 10},
        new SelectListItem {Text = "11", Value = "11", Selected = Model.Month == 11},
        new SelectListItem {Text = "12", Value = "12", Selected = Model.Month == 12},
     };

Answer 1

我认为您对属性“Selected”感到困惑，如果您设置为 true，它将成为您的选择列表的默认选项 我尝试修改您的代码如下：

@{
    int year = 2022;
    int month = 3;
    int daysInMonth = DateTime.DaysInMonth(year, month);

    var months = new List<SelectListItem>()
{
    new SelectListItem {Text = "1", Value = "1"},
    new SelectListItem {Text = "2", Value = "2"},
    new SelectListItem {Text = "3", Value = "3",Selected=true},
    new SelectListItem {Text = "4", Value = "4"},
    new SelectListItem {Text = "5", Value = "5"},
    new SelectListItem {Text = "6", Value = "6"},
    new SelectListItem {Text = "7", Value = "7"},
    new SelectListItem {Text = "8", Value = "8"},
    new SelectListItem {Text = "9", Value = "9"},
    new SelectListItem {Text = "10", Value = "10"},
    new SelectListItem {Text = "11", Value = "11"},
    new SelectListItem {Text = "12", Value = "12"},
    };
}
<script src="~/lib/jquery/dist/jquery.min.js"></script>

<script>
    $(function () {
        // initialize the value of the input field to the selected value


        $('.Month').val($('#selectlist').val());

        $('#selectlist').change(function () {
            // when the value of the dropdown list changes
            // update the input field
            var month = $(this).val();
            console.log(month);
            $("#titlemonth").text($(this).val());
            $('.Month').val($(this).val());
           
            $(document).find("tr[id='PunchIn[30]']").remove();
            if ((month == 1) || (month == 3) || (month == 5) || (month == 7) || (month == 8) || (month == 10) || (month == 12))
            {
                $(document).find("table[id=test]").append('<tr id="PunchIn[30]"><td><div class="form-group"><input name="PunchIn[30].Month" class="Month" value="" type="number" id="Month" /></div><div class="form-group"><a name="31">31</a><input name="PunchIn[30].Day" class="form-control" value="31" hidden type="number" id="Day" /><span value="31" class="text-danger field-validation-valid" data-valmsg-for="Day" data-valmsg-replace="true"></span></div></td><td><div class="form-group"><input name="PunchIn[30].PunchIn1" class="form-control" type="time" id="PunchIn1" value="" /><span class="text-danger field-validation-valid" data-valmsg-for="PunchIn1" data-valmsg-replace="true"></span></div></td><td><div class="form-group"><input name="PunchIn[30].PunchOut" class="form-control" type="time" id="PunchOut" value="" /><span class="text-danger field-validation-valid" data-valmsg-for="PunchOut" data-valmsg-replace="true"></span></div></td><td><div class="form-group"><input name="PunchIn[30].Remark2" class="form-control" type="text" id="Remark2" value="" /><span class="text-danger field-validation-valid" data-valmsg-for="Remark2" data-valmsg-replace="true"></span></div></td></tr>');
               
            }
            
            
            
        });
        
    });


</script>



<h1>Create</h1>

<h4>PunchIn</h4>
<hr />
<select id="selectlist" asp-items=months></select>
<h2 align="center">@year <a id="titlemonth">@month</a> Month</h2>
<form asp-action="Create">

    <table class="table"id="test">
        <thead>
            <tr>
                <th>
                    date
                </th>
                <th>
                    Punch in time
                </th>
                <th>
                    Puncn out time
                </th>
                <th>
                    remark
                </th>

            </tr>
        </thead>
        <tbody >

            @for (int day = 1; day <= daysInMonth; day++)
            {

                <tr id="PunchIn[@(day-1)]">

                    <td>
                        <div class="form-group">
                            <input name=PunchIn[@(day-1)].Month asp-for="Month" class="Month" value="" />
                        </div>
                        <div class="form-group">
                            <a name="@day">@day</a>
                            <input name=PunchIn[@(day-1)].Day asp-for="Day" class="form-control" value=@day hidden />
                            <span asp-validation-for="Day" value="@day" class="text-danger"></span>
                        </div>
                    </td>
                    <td>
                        <div asp-validation-summary="ModelOnly" class="text-danger"></div>
                        <div class="form-group">
                            <input name=PunchIn[@(day-1)].PunchIn1 asp-for="PunchIn1" class="form-control" />
                            <span asp-validation-for="PunchIn1" class="text-danger"></span>
                        </div>
                    </td>
                    <td>
                        <div class="form-group">
                            <input name=PunchIn[@(day-1)].PunchOut asp-for="PunchOut" class="form-control" />
                            <span asp-validation-for="PunchOut" class="text-danger"></span>
                        </div>
                    </td>
                    <td>
                        <div class="form-group">
                            <input name=PunchIn[@(day-1)].Remark2 asp-for="Remark2" class="form-control" />
                            <span asp-validation-for="Remark2" class="text-danger"></span>
                        </div>
                    </td>

                </tr>

            }
            <input type="submit" value="Create" class="btn btn-primary" />
        </tbody>

    </table>
</form>

结果：