Odwołanie do tablicy tworzonej przez ASP .NET Razor

0

Cześć,

Oto część mojego pliku .cshtml:

<table class="table">
                        <caption>Grafik pracownika</caption>
                        <thead>
                            <tr>
                                <th scope="col">Dzień tygodnia</th>
                                <th scope="col">Od godziny</th>
                                <th scope="col">Do godziny</th>
                                <th scope="col">Wolne</th>
                            </tr>
                        </thead>
                        <tbody>
                           @foreach (var shift in Model.Shifts)
                           {
                            <tr>
                                <td><label asp-for="@shift.DayOfWeek"/>@shift.DayOfWeek</td>
                                <td><input id="dateFrom" class="form-control" asp-for="@shift.DateFrom" type=time /></td>
                                <td><input id="dateTo" class="form-control" asp-for="@shift.DateTo" type=time /></td>
                                <td><input type="checkbox" class="form-check-input text-center" id="freeDayCheckbox" onclick="changeEditable()"></td>
                            </tr>
                           }
                        </tbody>
                    </table>

Rekordy tablicy tworzone są "dynamicznie" z modelu, który jest przekazywany do widoku.

W jaki sposób mogę się odwołać poprzez javascript do obiektu, któremu nadaję dynamiczne id (tak, obecnie w powyższym kodzie wpisałem id'ki na sztywno)?
Poniżej mój skrypt js:

            function changeEditable() {
                var checkbox = document.getElementById(freeDayCheckbox);
                if (checkbox.checked == true) {
                    document.getElementById("dateTo").readOnly = false
                }
                else {
                    document.getElementById("dateTo").readOnly = true
                };
0

Zawsze można trzasnąć coś w stylu

event.target.parentNode.children[2].readOnly = event.target.checked

lub coś prostszego, zamiast kombinować z generowaniem idków, czy serializacją modelu i przekazywaniem do jsa.

0

@urke:
Wiem, że może nie zrobiłem tego optymalnie, ale w międzyczasie wykombinowałem coś takiego (działa):

<td><input type="checkbox" class="form-check-input text-center" data-day="@shift.DayOfWeek" id="@(shift.DayOfWeek+"freeDayCheckbox")" onclick="changeEditable(this.getAttribute('data-day'))"></td>
        <script>

            function changeEditable(dayOfWeek) {
                var checkbox = document.getElementById(dayOfWeek + "freeDayCheckbox");
                if (checkbox.checked == true) {
                    document.getElementById(dayOfWeek + "dateTo").readOnly = true
                    document.getElementById(dayOfWeek + "dateFrom").readOnly = true
                }
                else
                    {
                    document.getElementById(dayOfWeek + "dateTo").readOnly = false
                    document.getElementById(dayOfWeek + "dateFrom").readOnly = false
                };
                };
        </script>

1 użytkowników online, w tym zalogowanych: 0, gości: 1