gcogco10 Ответов: 2

Как установить и снять флажок с помощью datepicker в jqueryui?

Привет Команда

Я изо всех сил пытаюсь установить и снять флажок, чтобы он мог заполнить datepicker. Кто-нибудь знает, как это сделать в jquery? Ниже этого то, что я попробовал на стороне бритвы

Что я уже пробовал:

<div class="form-check">
                                                <div class="col-xl-2">
                                                    @Html.CheckBoxFor(model => model.Lockuntil, new { @checked = "unchecked", @class = "rb" })
                                                    <label class="form-check-label" for="@Html.IdFor(model => model.Lockuntil)">Lockuntil</label>
                                                    @Html.TextBoxFor(model => model.DateColumn, new { @class = "datepicker17", id = "datepicker17" })


                                                </div>

                                            </div>

Sandeep Mewara

Не ясно, какую роль checkbox имеет с datepicker. Вы можете, пожалуйста, пояснить?

gcogco10

Что я хочу, когда пользователь нажимает на флажок-должен принести datepicker для того, чтобы выбрать дату и время. когда его не остановить, он должен исчезнуть, не видя.

2 Ответов

Рейтинг:
11

Richard Deeming

Вам нужно будет использовать простой Javascript:

@Html.CheckBoxFor(model => model.Lockuntil, new { @class = "rb", data_toggle = "hide-element", data_target = "#datepicker17" })
@Html.LabelFor(model => model.Lockuntil, new { @class = "form-check-label" })
@Html.TextBoxFor(model => model.DateColumn, new { id = "datepicker17" })
$(function(){
    var toggleHideElement = function(chk){
        var target = $(chk.getAttribute("data-target"));
        if (chk.checked) {
            target.removeClass("d-none").attr("aria-hidden", "false");
        }
        else {
            target.addClass("d-none").attr("aria-hidden", "true");
        }
    };
    
    // Change the state of the target element when the box is checked / unchecked:
    $(document).on("change", "input:checkbox[data-toggle='hide-element']", function(){ toggleHideElement(this); });
    
    // Set the initial state of the target element:
    $("input:checkbox[data-toggle='hide-element']").each(function(){ toggleHideElement(this); });
});

gcogco10

@Richard спасибо, приятель

Рейтинг:
0

Gerry Schmitz

Неправильный контроль. Datepicker не "включен или выключен"; он "выскочил", либо используя "на Фокусе", либо в ответ на "кнопку"; он отклоняется, как только пользователь выбирает дату или "отменяет" ее.

Все остальное-это "календарь" (элемент управления), который используется в другом контексте.

gcogco10

Джерри, не могли бы вы привести мне пример того, как использовать его в jquery и bootstrap?

Gerry Schmitz

https://jqueryui.com/datepicker/

(щелкните по текстовому полю)