Форма MVC Значение не передается в JavaScript при использовании начальной загрузки, чтобы скрыть и показать поле

Question

Я пытаюсь передать значение из формы MVC в JavaScript. Я использую бутстрап, чтобы скрыть и показать поле. Когда я удаляю функцию скрытия и показа начальной загрузки в форме, я получу значение в окне сообщения, но когда функция Скрыть / Показать включена, я не могу получить значение, как показано на рисунке ниже. Кто-нибудь может сказать мне, где я иду не так

HTML

      @using (Html.BeginForm("SearchPatient","HOME", FormMethod.Post, new { enctype = "multipart/form-data" }))
      {
         @Html.AntiForgeryToken()

                <div class="form-horizontal">
                    <div class="form-group">
                        @Html.Label("Search Criteria", htmlAttributes: new { @class = "control-label  col-md-2" })
                        <div class="col-md-10">
                         @Html.DropDownListFor(model => model.SearchCriteria,
                         new List<SelectListItem> {
                         new SelectListItem { Value = "" , Text = "Select Search Criteria" },
                          new SelectListItem { Value = "1" , Text = "Patient Id" },

                       }, new { @class = "form-control selectchosen" })

                        </div>
                    </div>

                    <div class="form-group" id="PatientId" style="display:none">
                        <div class="form-group">
                            @Html.LabelFor(model => model.PatientId, htmlAttributes: new { @class = "control-label col-md-2" })

                            <div class="col-md-10">
                                @Html.EditorFor(model => model.PatientId, new { htmlAttributes = new { @class = "form-control " } })    
                            </div>
                        </div>
                    </div>

                    <div class="form-group" id="AllShow" style="display:none">

                        <div class="form-group">
                            <div class="col-lg-offset-2">
                                <input type="button" value="Search" class="btn btn-success" id="btnSubmit" onclick="Enablecontrols();" />

                            </div>
                        </div>
                    </div>
                </div>         
}

JavaScript

<script type="text/javascript">

 $('#SearchCriteria').change(function () {
   if ($("#SearchCriteria").val() == 1) {
   $("#AllShow").show();
   $("#PatientId").show();
   ValidateField("PatientId", true);  
  }
function Enablecontrols() {
  $(document).ready(function () {

    var patientid = $("#PatientId").val();
   if ($("#SearchCriteria").val() == 1) {
        alert("I am an alert box! the patient number is" + patientid);
     }
   }
 }
 </script>

Answer 1

Исправлена ​​ошибка, связанная с изменением идентификатора элемента Div на dPatientId. Глупая ошибка

Answer 2

вместо того, чтобы использовать методы начальной загрузки show / hide, используйте toggle. Это более надежно.

Если это не сработает, вы также можете использовать $('#PatientId').css('display','block');