Мой JavaScript не работает с моим представлением asp.net

Question

У меня возникли небольшие проблемы с моим JavaScript в моем режиме бритвы. Я хочу, чтобы пользователь сообщал об отсутствии, но когда он выбирает время, когда я хочу, чтобы пикет дат-времени показывался, поэтому пользователю не нужно вручную вводить дату.

Я также хочу, чтобы это были две разные вкладки, первая вкладка - это то, где пользователь сообщит о своем отдыхе, а на другой вкладке он увидит отчеты о более старших отпусках. Но теперь все это появляется в одних. Я хотел бы, чтобы он похож на это:

Но теперь «Begärd semstrar» просто сидит под «Бегарь семестре»

Это мой взгляд долго с моей JavaScript

@using Salesweb.Common.Utilities 
@model List<Salesweb.Common.Vacation> 
@{ 
    ViewBag.Title = "Semester"; 
} 

<script type="text/javascript" language="javascript"> 
    $(function() { 
     $(function() { 
      $('#fromDate').datepicker({ 
       showButtonPanel: true, 
       changeMonth: true, 
       changeYear: true, 
       dateFormat: "yy-mm-dd", 
       firstDay: 1, 
       onSelect: function (dateText) { 
        $('#EndDate').datepicker('option', 'minDate', new Date(dateText)); 
       } 
      }); 

      $('#toDate').datepicker({ 
       showButtonPanel: true, 
       changeMonth: true, 
       changeYear: true, 
       dateFormat: "yy-mm-dd", 
       firstDay: 1, 
       onSelect: function (dateText) { 
        $('#EndDate').datepicker('option', 'minDate', new Date(dateText)); 
       } 
      }); 

     }); 
    }); 

    $(function() { 
     $("#tabs").tabs(); 
    }); 
</script> 
<div class="page-container"> 
    <div class="page-content"> 
     <div class="container"> 
      <div class="row"> 
       <div class="col-md-12"> 
        <div id="tabs"> 
         <div class="portlet light"> 
          <ul> 
           <li><a href="#tabs-new">Begär semester</a></li> 
           <li><a href="#tabs-list">Begärda semestrar</a></li> 
          </ul> 

          <div id="tabs-new"> 
           @if (ViewData["posted"] == null) 
           { 
            using (Html.BeginForm("Index", "Vacation", FormMethod.Post, new { enctype = "multipart/form-data" })) 
            { 
             <div class="portlet light"> 
              <div class="portlet-title"> 
               <div class="caption"> 
                <span class="caption-subject font-green-sharp bold uppercase">Semester</span> 
               </div> 
              </div> 
              <div class="portlet-body"> 
               <table class="table table-striped table-bordered table-hover"> 
                <tr> 
                 <td>Från:</td> 
                 <td><input type="text" id="fromDate" name="fromDate" style="width: 70px" /></td> 
                </tr> 
                <tr> 
                 <td>Till:</td> 
                 <td><input type="text" id="toDate" name="toDate" style="width: 70px" /></td> 
                </tr> 
                <tr> 
                 <td>Kommentar:</td> 
                 <td><textarea id="comment" name="comment" style="width: 300px; height: 70px;" rows="5" cols="5"></textarea></td> 
                </tr> 
                <tr> 
                 <td></td> 
                 <td><input type="submit" value="Begär semester" id="submit" name="submit" /></td> 
                </tr> 
               </table> 
              </div> 
             </div> 
            } 

           } 
           else 
           { 
            <h2 style="color: Green"> Semestern begärd.</h2> 
            @Html.ActionLink("Begär ny semester", "Index") 
           } 
          </div> 

          <div id="tabs-list"> 
           <div class="portlet light"> 
            <div class="portlet-title"> 
             <div class="caption"> 
              <span class="caption-subject font-green-sharp bold uppercase">Semester</span> 
             </div> 
            </div> 
            <div class="portlet-body"> 
             <table class="table table-striped table-bordered table-hover"> 
              <thead> 
               <tr> 
                <th>Från</th> 
                <th>Till</th> 
                <th>Rapportera tid</th> 
                <th>Status</th> 
                <th>Kommentar</th> 
               </tr> 
              </thead> 
              @foreach (var vacation in Model) 
              { 
               <tr> 
                <td>@(vacation.StartDate.ToShortDateString())</td> 
                <td>@(vacation.EndDate.ToShortDateString())</td> 
                <td> 
                 @if (vacation.TimeReported) 
                 { 
                  <a>Tid har rapporterats</a> 
                 } 
                 else if (vacation.Status == (int)VacationStatus.Godkänd && !vacation.TimeReported) 
                 { 
                  <a href="@(Url.Action("Absent", "Reports", new { vacationId = vacation.VacationID }))">Rapportera tid</a> 
                 } 
                 else 
                 { 
                  <a>-</a> 
                 } 
                </td> 
                <td>@(((VacationStatus)vacation.Status).ToString()) </td> 
                <td>@vacation.Comment</td> 
               </tr> 
              } 
             </table> 
            </div> 
           </div> 
          </div> 
         </div> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 

Я загружаю в моем сценарии в связке

  bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
        "~/Scripts/modernizr-2.8.3", 
        "~/content/global/plugins/jquery.min.js", 
        "~/content/global/plugins/jquery-ui/jquery-ui.min.js", 
        "~/content/global/plugins/bootstrap/js/bootstrap.min.js", 
        "~/content/global/plugins/datatables/media/js/jquery.dataTables.min.js", 
        "~/content/global/plugins/datatables/extensions/TableTools/js/dataTables.tableTools.js", 
        "~/content/global/plugins/datatables/plugins/bootstrap/dataTables.bootstrap.js", 
        "~/content/global/scripts/metronic.js", 
        "~/content/admin/layout3/scripts/layout.js", 
        "~/content/admin/layout3/scripts/demo.js", 
        "~/content/admin/pages/scripts/table-advanced.js" 
        )); 

И чем от моего _Layout.cshtml я загружаю в сценарии, как это.

@Scripts.Render("~/bundles/modernizr") 

Answer 1

Ваших JQuery документ, готовые функции немного грязные/вложенной

$(function() { 
    $('#fromDate').datepicker({ 
     showButtonPanel: true, 
     changeMonth: true, 
     changeYear: true, 
     dateFormat: "yy-mm-dd", 
     firstDay: 1, 
     onSelect: function (dateText) { 
      $('#EndDate').datepicker('option', 'minDate', new Date(dateText)); 
     } 
    }); 

    $('#toDate').datepicker({ 
     showButtonPanel: true, 
     changeMonth: true, 
     changeYear: true, 
     dateFormat: "yy-mm-dd", 
     firstDay: 1, 
     onSelect: function (dateText) { 
      $('#EndDate').datepicker('option', 'minDate', new Date(dateText)); 
     } 
    }); 
    $("#tabs").tabs(); 
}); 

я удалил дублированные документы готовых чеков. Попробуйте приведенный выше код.