title: jQuery Uncaught TypeError: $(...).tabs is not a function
body: <p>ASP.NET 4.5 WebForms.</p>
  
  <p>I've found other posts on SO where people seemed to have these same issues, however their answers didn't resolve my issue. Which is strange because my tabs on another page still function perfectly.</p>
  
  <p>At first I thought the issue was caused by adding a decent amount of code-behind on the page, however commenting out everything in my Page_Load and Page_Init methods the problem persists.</p>
  
  <p><a href="https://i.stack.imgur.com/duTca.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/duTca.jpg" alt="Inspector Error"></a></p>
  
  <p>I've tried adding $(document).ready call to my js file as well to no avail...
  I saw <a href="https://stackoverflow.com/questions/24101645/uncaught-typeerror-undefined-is-not-a-function-using-jquery-tabs">this</a> post and tried to see if my problem related, it does not.
  From the error seen in the browser inspector it appears that either jQuery isn't loaded when my script is ran so I tried placing it at the bottom of the page, no change. Then I tried using bundles in the Site.Master... still nothing. I'm stumped. The exact same setup exists on another page in this site and loads just fine what did I break with this page?</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$(function () {
      $("#tabs").tabs();
      $("#tabs").addClass("ui-tabs-vertical ui-helper-clearfix");
      $("#tabs li").removeClass("ui-corner-top").addClass("ui-corner-left");
  });</code></pre>
  <pre class="snippet-code-css lang-css prettyprint-override"><code>/*#region Direct Reporting*/
  .dd {
      overflow: auto;
      white-space: nowrap;
  }
  
  div#dr_tab {
      overflow:auto;
      white-space: nowrap;
  }
  
  section#tables_container {
      overflow: auto;
      width: 2000px;
  }
  
      section#tables_container div {
          display: inline;
          overflow:auto;
      }    
  
      section#tables_container table {
              display: inline;
              float: left;
              margin-bottom: 50px;
              border: 1px solid #252525;
              margin-right: 8px;
              margin-top:10px;
              width: auto;
              white-space:nowrap;
          }
  
      section#tables_container table th {
          padding-bottom: 5px;
          padding-top: 10px;
          column-span: all;
      }
   /*#endregion*/
  
  /*#region Contractor Time*/
  div#ct_tab {
      overflow: auto;
  }
  section#contractor_time {
      overflow: auto;
      width: 2000px;
  }
          section#contractor_time_table table td {
              white-space: nowrap;
              padding-right: 10px;
              padding-bottom: 5px;
              text-align: center;
          }
  /*#endregion*/
  
  /*#region Manpower*/
  
  section#manpower_dropdown {
      text-align: center;
  }
  
  section#manpower_manage {
      text-align: center;
  }
  section#manpower_manage label {
      display: inline;
  }
  
  /*#endregion*/
  
  /*#region Tabs*/
  #tabs &gt; div &gt; h2 {
      display: block;
      text-align: center;
      border-bottom: 2px solid #252525;
      border-top: 2px solid #252525;
  }
  
  #tabs &gt; ul &gt; li &gt; a {
      padding-top: 20px;
      padding-bottom: 20px;
      border-left: 1px solid #252525;
  }
  
  .ui-tabs-vertical {
      width: 55em;
  }
  
      .ui-tabs-vertical .ui-tabs-nav {
          float: left;
          padding: .2em .1em .2em .1em;
          width: 8em;
      }
  
          .ui-tabs-vertical .ui-tabs-nav &gt; li {
              clear: left;
              width: 100%;
              border-bottom-width: 1px !important;
              border-right-width: 0 !important;
              margin: 0 -1px .2em 0;
          }
  
              .ui-tabs-vertical .ui-tabs-nav &gt; li &gt; a {
                  display: block;
                  text-align: center;
              }
  
          .ui-tabs-vertical .ui-tabs-nav li.ui-tabs-active {
              padding-bottom: 0;
              padding-right: .1em;
              border-right-width: 1px;
          }
  
      .ui-tabs-vertical .ui-tabs-panel {
          padding: 1em;
          float: right;
          width: 43em;
          border-bottom: 2px solid #252525;
          border-right: 2px solid #252525;
          background-color: #F7F7F7;
      }
  
  .ui-tabs .ui-tabs-hide { display: none !important; }
  
  .ui-tabs &gt; ul {
      list-style: none;
  }
  
  /*#endregion*/
  
  .content_wrapper {
      margin: 0 auto;
      max-width: 1000px;
  }
  
  ::-webkit-scrollbar {
      height: 10px;
  }
  ::-webkit-scrollbar-track {
      background-color: #000;
  }
  ::-webkit-scrollbar-thumb {
      background-color: #FFFF00;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;asp:Content ID="HeadContent" ContentPlaceHolderID="HeadContent" runat="server"&gt;
      &lt;link href="/Management/css/management.css" rel="stylesheet" type="text/css" /&gt;
      &lt;%--&lt;script src="/Management/scripts/management.js"&gt;&lt;/script&gt;--%&gt;
  &lt;/asp:Content&gt;
  &lt;asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server"&gt;
      &lt;section id="tabs"&gt;
          &lt;ul&gt;
              &lt;li&gt;&lt;a href="#mp_tab"&gt;Manpower&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#ct_tab"&gt;Contractor Time&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#dr_tab"&gt;Direct Reports&lt;/a&gt;&lt;/li&gt;
          &lt;/ul&gt;
          &lt;div id="mp_tab"&gt;
              &lt;h2&gt;Manpower&lt;/h2&gt;
              &lt;asp:UpdatePanel ID="ManpowerPanel" runat="server" UpdateMode="Conditional"&gt;
                  &lt;ContentTemplate&gt;
                      &lt;section id="manpower_dropdown"&gt;
                          &lt;asp:DropDownList runat="server" ID="ManpowerDropDown" OnSelectedIndexChanged="ManpowerDropDown_SelectedIndexChanged" AutoPostBack="true"&gt;
                              &lt;asp:ListItem Text="All" Value="0"  /&gt;
                              &lt;asp:ListItem Text="Contractors" Value="2" /&gt;
                              &lt;asp:ListItem Text="Zebra" Value="1" /&gt;
                              &lt;asp:ListItem Text="Terminated" Value="3" /&gt;
                          &lt;/asp:DropDownList&gt;
                          &lt;asp:DropDownList runat="server" ID="ManpowerChooseUserDropdown" OnSelectedIndexChanged="ManpowerChooseUserDropdown_SelectedIndexChanged" AutoPostBack="true"&gt;
                          &lt;/asp:DropDownList&gt;
                          &lt;asp:Button ID="ManpowerManageButton" Text="Manage" runat="server" OnClick="ManpowerManageButton_Click"/&gt;
                      &lt;/section&gt;
                      &lt;section id="manpower_manage"&gt;
                          &lt;asp:UpdatePanel ID="ManpowerManagePanel" runat="server" UpdateMode="Conditional" Visible="false"&gt;
                              &lt;ContentTemplate&gt;
                                  &lt;asp:CheckBox Text="New Hire" runat="server" ID="ManpowerManageNewHireCheckbox" AutoPostBack="true" ToolTip="Employee is new hire" OnCheckedChanged="ManpowerManageNewHireCheckbox_CheckedChanged" /&gt;
                                  &lt;asp:CheckBox Text="Contractor" runat ="server" ID="ManpowerManageIsConCheckbox" AutoPostBack="false" ToolTip="Employee Contractor status" /&gt;
                                  &lt;asp:CheckBox Text="D/I" runat="server" ID="ManpowerManageDirectCheckbox" ToolTip="If checked employee is Direct" /&gt;
                                  &lt;asp:CheckBox Text="Active" runat="server" ID="ManpowerManageActiveCheckbox" ToolTip="If checked employee is Active" /&gt;
                                  &lt;br /&gt;
                                  &lt;asp:TextBox runat="server" ID="ManpowerManageCoreIdTextbox" AutoPostBack="false" ToolTip="Core ID" placeholder="Core ID.." ValidationGroup="ManpowerManage"/&gt;
                                  &lt;asp:TextBox runat="server" ID="ManpowerManageFNameTextbox" AutoPostBack="false" ToolTip="Employee First Name" placeholder="First Name.." ValidationGroup="ManpowerManage"/&gt;
                                  &lt;asp:TextBox runat="server" ID="ManpowerManageLNameTextbox" AutoPostBack="false" ToolTip="Employee Last Name" placeholder="Last Name.." ValidationGroup="ManpowerManage"/&gt;
                                  &lt;asp:TextBox runat="server" ID="ManpowerManageBadgeTextbox" AutoPostBack="false" ToolTip="Employee Badge" placeholder="Badge #.." /&gt;
                                  &lt;br /&gt;                                
                                  &lt;asp:TextBox runat="server" TextMode="DateTimeLocal" ID="ManpowerManageCStartDateTextbox" AutoPostBack="false" ToolTip="Employee Contractor start date" /&gt;
                                  &lt;asp:TextBox runat="server" TextMode="DateTimeLocal" ID="ManpowerManageZStartDateTextbox" AutoPostBack="false" ToolTip="Employee Zebra start date" /&gt;
                                  &lt;asp:TextBox runat="server" TextMode="DateTimeLocal" ID="ManpowerManageTermDateTextbox" AutoPostBack="false" ToolTip="Employee Termination date" /&gt;
                                  &lt;br /&gt;
                                  &lt;asp:TextBox runat="server" ID="ManpowerManageTermReasonTextbox" AutoPostBack="false" ToolTip="Employee Termination Reason" Width="89%" placeholder="Termination Reason" /&gt;
                                  &lt;br /&gt;
                                  &lt;asp:DropDownList runat="server" ID="ManpowerManageSupDropdown" AutoPostBack="false" ToolTip="Supervisor of Employee" ValidationGroup="ManpowerManage"/&gt;
                                  &lt;asp:DropDownList runat="server" ID="ManpowerManageShiftDropdown" AutoPostBack="false" ToolTip="Employee Shift" ValidationGroup="ManpowerManage"&gt;
                                      &lt;asp:ListItem Text="--Shift--" /&gt;
                                      &lt;asp:ListItem Text="Day" Value="0" /&gt;
                                      &lt;asp:ListItem Text="Night" Value="1" /&gt;
                                  &lt;/asp:DropDownList&gt;
                                  &lt;asp:DropDownList runat="server" ID="ManpowerManageTeamDropdown" AutoPostBack="false" ToolTip="Employee Team" ValidationGroup="ManpowerManage"/&gt;
                                  &lt;br /&gt;
                                  &lt;asp:Button ID="ManpowerManageCancelButton" Text="Cancel" runat="server" OnClick="ManpowerManageCancelButton_Click"/&gt;
                                  &lt;asp:Button ID="ManpowerManageSubmitButton" Text="Submit" runat="server" OnClick="ManpowerManageSubmitButton_Click" ValidationGroup="ManpowerManage"/&gt;
                                  &lt;br /&gt;
                                  &lt;asp:RequiredFieldValidator ID="CoreIdCandidate" runat="server" ControlToValidate="ManpowerManageCoreIdTextbox" ErrorMessage="Core ID Required" InitialValue="" SetFocusOnError="true" ValidationGroup="ManpowerManage" Display="Dynamic" Enabled="true"/&gt;
                                  &lt;asp:RequiredFieldValidator ID="FirstNameCandidate" runat="server" ControlToValidate="ManpowerManageFNameTextbox" ErrorMessage="First Name Required" InitialValue="" SetFocusOnError="true" ValidationGroup="ManpowerManage" Display="Dynamic" Enabled="true" /&gt;
                                  &lt;asp:RequiredFieldValidator ID="LastNameCandidate" runat="server" ControlToValidate="ManpowerManageLNameTextbox" ErrorMessage="Last Name Required" InitialValue="" SetFocusOnError="true" ValidationGroup="ManpowerManage" Display="Dynamic" Enabled="true" /&gt;  
                                  &lt;asp:RequiredFieldValidator ID="SupervisorCandidate" runat="server" ControlToValidate="ManpowerManageSupDropdown" ErrorMessage="Supervisor Required" InitialValue="" SetFocusOnError="true" ValidationGroup="ManpowerManage" Display="Dynamic" Enabled="true" /&gt;
                                  &lt;asp:RequiredFieldValidator ID="ShiftCandidate" runat="server" ControlToValidate="ManpowerManageShiftDropdown" ErrorMessage="Shift Required" InitialValue="" SetFocusOnError="true" ValidationGroup="ManpowerManage" Display="Dynamic" Enabled="true"/&gt;   
                                  &lt;asp:RequiredFieldValidator ID="TeamCandidate" runat="server" ControlToValidate="ManpowerManageTeamDropdown" ErrorMessage="Team Required" InitialValue="" ValidationGroup="ManpowerManage" Display="Dynamic" Enabled="true"/&gt;                       
                              &lt;/ContentTemplate&gt;
                          &lt;/asp:UpdatePanel&gt;
                      &lt;/section&gt;
                      &lt;section id="manpower_table"&gt;
                          &lt;asp:Table runat="server" ID="ManpowerTable" Width="100%"&gt;
                              &lt;asp:TableHeaderRow&gt;
                                  &lt;asp:TableHeaderCell&gt;Name&lt;/asp:TableHeaderCell&gt;
                                  &lt;asp:TableHeaderCell&gt;Core ID&lt;/asp:TableHeaderCell&gt;
                                  &lt;asp:TableHeaderCell&gt;Badge&lt;/asp:TableHeaderCell&gt;
                                  &lt;asp:TableHeaderCell&gt;Team&lt;/asp:TableHeaderCell&gt;
                                  &lt;asp:TableHeaderCell&gt;Supervisor&lt;/asp:TableHeaderCell&gt;
                                  &lt;asp:TableHeaderCell&gt;Shift&lt;/asp:TableHeaderCell&gt;
                              &lt;/asp:TableHeaderRow&gt;
                          &lt;/asp:Table&gt;
                      &lt;/section&gt;
                  &lt;/ContentTemplate&gt;
              &lt;/asp:UpdatePanel&gt;
          &lt;/div&gt;
          &lt;div id="ct_tab"&gt;
              &lt;h2&gt;Contractor Time Management&lt;/h2&gt;            
              &lt;asp:UpdatePanel runat="server" ID="ContractorTimePanel" UpdateMode="Conditional" Visible="true" Width="1000px"&gt;
                  &lt;ContentTemplate&gt;
                      &lt;section id="contractor_dropdown_container"&gt;
                          &lt;asp:DropDownList runat="server" ID="ContractorTimeDropdown" AutoPostBack="true" OnSelectedIndexChanged="ContractorTimeDropdown_SelectedIndexChanged" ToolTip="Select contractor name to view punches."&gt;
                          &lt;/asp:DropDownList&gt;
                          &lt;asp:TextBox runat="server" TextMode="DateTimeLocal" ID="ContractorTimeRangeStart" AutoPostBack="false" ToolTip="Punch range start date." Width="175px" /&gt;
                          &lt;asp:TextBox runat="server" TextMode="DateTimeLocal" ID="ContractorTimeRangeStop" AutoPostBack="false" ToolTip="Punch range stop date." Width="175px"/&gt;
                          &lt;asp:Button runat="server" ID="SelectContractorForUpdateButton" Text="Edit Punches" ToolTip="Selects Contractor in dropdown to view punches and update if required. Optionally add start and end date ranges to narrow results." OnClick="SelectContractorForUpdateButton_Click" /&gt;
                          &lt;asp:Button ID="SelectContractorForTimeReportButton" Text="Time Report" runat="server" ToolTip="Selects Contractor in dropdown to view their time totals for a specified date range." OnClick="SelectContractorForTimeReportButton_Click" ValidationGroup="TimeReport"/&gt;
                          &lt;br /&gt;
                          &lt;asp:RequiredFieldValidator ID="ContractorCandidate" ErrorMessage="Choose Contractor to view their report!" InitialValue="" ControlToValidate="ContractorTimeDropdown" runat="server" SetFocusOnError="true" Display="Dynamic" ValidationGroup="TimeReport" Enabled="true" /&gt;
                      &lt;/section&gt;
                      &lt;asp:UpdatePanel runat="server" ID="ContractorTimeEditPanel" UpdateMode="Conditional" Visible="false"&gt;
                          &lt;ContentTemplate&gt;
                              &lt;asp:DropDownList runat="server" ID="PunchIdDropdown" AutoPostBack="true" OnSelectedIndexChanged="PunchIdDropdown_SelectedIndexChanged" TootlTip="Select ID of punch to update."&gt;
                              &lt;/asp:DropDownList&gt;
                              &lt;asp:TextBox runat="server" TextMode="DateTimeLocal" ID="ContractorPunchInTextbox" Width="175px" ToolTip="Punch IN date/time."/&gt;
                              &lt;asp:TextBox runat="server" TextMode="DateTimeLocal" ID="ContractorPunchOutTextbox" Width="175px" ToolTip="Punch Out date/time."/&gt;
                              &lt;asp:Label runat="server" ID="UpdatedByLabel"&gt;&lt;/asp:Label&gt;
                              &lt;asp:TextBox runat="server" TextMode="DateTimeLocal" ID="ContractorPunchUpdatedDateTextbox" Width="175px" ToolTip="Select date/time punch was updated."/&gt;
                              &lt;asp:Button runat="server" ID="CancelUpdatePunchButton" Text="Cancel" OnClick="CancelUpdatePunchButton_Click"/&gt;
                              &lt;asp:Button runat="server" ID="UpdatePunchButton" Text="Submit" ToolTip="Submits updated punch data." OnClick="UpdatePunchButton_Click"/&gt;
                              &lt;asp:TextBox runat="server" ID="ContractorPunchUpdatedReasonTextbox" Width="100%" ToolTip="Reason punch was updated."/&gt;
                          &lt;/ContentTemplate&gt;
                      &lt;/asp:UpdatePanel&gt;
                      &lt;section id="contractor_time_table"&gt;
                          &lt;asp:Table runat="server" ID="ContractorTimeTable" Width="100%" Visible="true"&gt;
                              &lt;asp:TableHeaderRow&gt;
                                  &lt;asp:TableHeaderCell&gt;Punch ID&lt;/asp:TableHeaderCell&gt;
                                  &lt;asp:TableHeaderCell&gt;Punch IN&lt;/asp:TableHeaderCell&gt;
                                  &lt;asp:TableHeaderCell&gt;Punch OUT&lt;/asp:TableHeaderCell&gt;
                                  &lt;asp:TableHeaderCell&gt;Updated BY&lt;/asp:TableHeaderCell&gt;
                                  &lt;asp:TableHeaderCell&gt;Update DATE&lt;/asp:TableHeaderCell&gt;
                                  &lt;asp:TableHeaderCell&gt;Update NOTES&lt;/asp:TableHeaderCell&gt;
                              &lt;/asp:TableHeaderRow&gt;
                          &lt;/asp:Table&gt;
                          &lt;asp:Table runat="server" ID="ContractorTimeReportTable" Width="100%" Visible="false"&gt;
                              &lt;asp:TableHeaderRow&gt;
                                  &lt;asp:TableHeaderCell&gt;Day&lt;/asp:TableHeaderCell&gt;
                                  &lt;asp:TableHeaderCell&gt;Punches&lt;/asp:TableHeaderCell&gt;
                                  &lt;asp:TableHeaderCell&gt;Total Time&lt;/asp:TableHeaderCell&gt;
                              &lt;/asp:TableHeaderRow&gt;
                          &lt;/asp:Table&gt;
                      &lt;/section&gt;
                  &lt;/ContentTemplate&gt;
              &lt;/asp:UpdatePanel&gt;
          &lt;/div&gt;
          &lt;div id="dr_tab"&gt;
              &lt;h2&gt;Direct Reports&lt;/h2&gt;
              &lt;section id="tables_container"&gt;
                  &lt;asp:UpdatePanel runat="server" ID="DirectReportsPanel" UpdateMode="Conditional" CssClass="dd" Width="200px"&gt;
                      &lt;ContentTemplate&gt;
                      &lt;/ContentTemplate&gt;
                  &lt;/asp:UpdatePanel&gt;
              &lt;/section&gt;
          &lt;/div&gt;
      &lt;/section&gt;
  &lt;/asp:Content&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>My Site.Master Contains the following:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;head runat="server"&gt;
      &lt;meta charset="utf-8" /&gt;
      &lt;title&gt;&lt;%: Page.Title %&gt; - BSP&lt;/title&gt;
      &lt;asp:PlaceHolder runat="server"&gt;     
          &lt;%: Scripts.Render("~/bundles/modernizr") %&gt;
          &lt;%: Scripts.Render("~/bundles/jquery") %&gt;
      &lt;/asp:PlaceHolder&gt;  
      &lt;webopt:BundleReference runat="server" Path="~/Content/css" /&gt; 
      &lt;link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" /&gt;
      &lt;meta name="viewport" content="width=device-width" /&gt;
      &lt;asp:ContentPlaceHolder runat="server" ID="HeadContent" /&gt;
  &lt;/head&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>The webopt:BundleReference contains:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;bundles version="1.0"&gt;
    &lt;styleBundle path="~/Content/css"&gt;
      &lt;include path="~/Content/Site.css" /&gt;
    &lt;/styleBundle&gt;
    &lt;styleBundle path="~/Content/themes/base/css"&gt;
      &lt;include path="~/Content/themes/base/jquery.ui.core.css" /&gt;
      &lt;include path="~/Content/themes/base/jquery.ui.resizable.css" /&gt;
      &lt;include path="~/Content/themes/base/jquery.ui.selectable.css" /&gt;
      &lt;include path="~/Content/themes/base/jquery.ui.accordion.css" /&gt;
      &lt;include path="~/Content/themes/base/jquery.ui.autocomplete.css" /&gt;
      &lt;include path="~/Content/themes/base/jquery.ui.button.css" /&gt;
      &lt;include path="~/Content/themes/base/jquery.ui.dialog.css" /&gt;
      &lt;include path="~/Content/themes/base/jquery.ui.slider.css" /&gt;
      &lt;include path="~/Content/themes/base/jquery.ui.tabs.css" /&gt;
      &lt;include path="~/Content/themes/base/jquery.ui.datepicker.css" /&gt;
      &lt;include path="~/Content/themes/base/jquery.ui.progressbar.css" /&gt;
      &lt;include path="~/Content/themes/base/jquery.ui.theme.css" /&gt;
    &lt;/styleBundle&gt;
  &lt;/bundles&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>EDIT: jquery bundles reference called in Site.Master:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>            // Add base/ui jQuery script library
              bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                  "~/Scripts/jquery-1.8.2.js",
                  "~/Scripts/jquery-ui-1.8.24.js"));</code></pre>
  </div>
  </div>
  </p>