如何使用jqueryui在表单中使用datepicker？

我需要一些帮助来使用我的复选框，其中用户将使用复选框，以便在使用复选框锁定之前立即显示日期选择器或日历。需要jquery方面的帮助才能使我的逻辑正常运行。当用户在使用calendor或datepicker锁定后取消选中时，必须将其隐藏。我还得到datepicker不是一个函数

<div class="form-group row">
            <div class="col-sm-2">
                @Html.CheckBoxFor(model => model.Lockuntil, new { @class = "rb", id = "Lockuntil" })

            </div>
            <div class="form-group row">
                <div class="col-sm-1">
                    @Html.TextBoxFor(model => model.DateSelect, new { @class = "datepicker", id = "TextValue" })
                </div>
            </div>
        </div>

        <!--Jquery for datechecking-->
        <script type="text/javascript">
            $(document).ready(function () {

                $('#Lockuntil').on('click', onClickCheckBox); // bind an event with checkbox on click. On click function onClickCheckBox will be called.

                onClickCheckBox(); // to hide or show on page load.c
            });

            function onClickCheckBox() // logic to show hide textbox based on checkbox's value.
            {
                if ($('#Lockuntil').is(":checked")) {
                    $("#TextValue").show();
                }
                else {
                    $("#TextValue").hide();
                }
            }
        </script>

@CheckBoxFor（model=>model.locktill，new{@class=“rb”，id=“locktill”}）
@Html.TextBoxFor（model=>model.DateSelect，新的{@class=“datepicker”，id=“TextValue”}）
$（文档）.ready（函数（）{
$（'#locktill'）。on（'click'，onClickCheckBox）；//单击时将事件与复选框绑定。单击时将调用函数onClickCheckBox。
onClickCheckBox（）；//在页面加载时隐藏或显示。c
});
函数onClickCheckBox（）//根据复选框的值显示隐藏文本框的逻辑。
{
如果（$（'#locktuntil'）。为（“：选中”））{
$（“#TextValue”）.show（）；
}
否则{
$（“#TextValue”）.hide（）；
}
}

考虑以下示例

$（函数（）{
$（'.form group'）。on（'click'，'.rb'，函数（e）{
如果（$（this）.is（“：checked”））{
$（“#TextValue”）.datepicker（“启用”）；
}否则{
$（“#TextValue”）.datepicker（“禁用”）；
}
});
$（“#TextValue”）.datepicker（）；
});

您是否添加了使用所需的cdn？@Swati已经解决了这个问题，现在我的日期选择器没有显示，需要对此更新后的逻辑提供一些帮助。请注意，您可以使用
$（“#日期选择器”）.toggle（$（this）.is（“：checked”）
来减少
onClickCheckBox
中的代码量。请注意，您在jQuery（使用
on（'click'
）和HTML（使用
onclick=“
）中都附加了事件侦听器，这可能会导致问题。@异端在我将此逻辑重做到论坛上更新的此逻辑后，检查和取消检查工作正常。但是，issue now Texbox没有显示datepicker，需要一些帮助。您没有在更新的代码中初始化datepicker？例如：
$（'#TextValue'）。datepicker（{..