单击复选框时未显示Datepicker？

问题描述

我想通过选中复选框来单击，但是TextBox没有显示我的日期选择器，并且需要一些帮助，没有javascript错误。这可能是什么原因？这是我的逻辑

$(document).ready(function() {

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

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

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

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

解决方法

  <script type="text/javascript">

                    $(document).ready(function () {

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

                        $('#TextValue').datepicker({
                            orientation: "bottom auto",format: 'dd MM yyyy',todayHighlight: true,minDate: 0
                        }).on('changeDate',function (ev) {
                            $(this).datepicker('hide');
                        });

                        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>