title: Bootstrap Tooltip Not Diplaying In Ajax Rendered Partial View
body: <p>I have a Bootstrap modal in a partial view.  In my index view I click a button to display the partial view modal on the current page.  Jquery validation is set up to display validation errors in Bootstrap tooltips.  These tooltips display wonderfully on all pages but on the rendered partial view.  </p>
  
  <p>I've tried setting the z-index of the tooltip to be greater than the modal but this does not work.</p>
  
  <p><strong>Partial View</strong></p>
  
  <pre><code>@model Phase_3.ViewModels.UserCreateViewModel
  
  &lt;div class="modal-header"&gt;
      &lt;button type="button" class="close" data-dismiss="modal" aria-hidden="true"&gt;&amp;times;&lt;/button&gt;
      &lt;h3&gt;New User&lt;/h3&gt;
  &lt;/div&gt;
  @using (Html.BeginForm("Create", "User", FormMethod.Post, new { @class = "remove-margin" }))
  {
      &lt;div class="modal-body"&gt;
  
          @Html.Label("First Name", new { @class = "inline" }) @Html.ValidationMessageFor(x =&gt; x.User.FirstName)
          @Html.TextBoxFor(x =&gt; x.User.FirstName, new { @class = "modal-input input-validation-error" })
  
          &lt;br /&gt;
          @Html.Label("Last Name")
          @Html.TextBoxFor(x =&gt; x.User.LastName, new { @class = "modal-input" })
          &lt;br /&gt;
          @Html.Label("Email")
          @Html.TextBoxFor(x =&gt; x.User.Email, new { @class = "modal-input" })
          &lt;br /&gt;
  
          @* REMOVE WHEN RANDOM SALT METHOD IS COMPLETED*@
          @Html.Label("Salt")
          @Html.TextBoxFor(x =&gt; x.User.Salt, new { @class = "modal-input" })
          &lt;br /&gt;
          @Html.Label("Password")
          @Html.TextBoxFor(x =&gt; x.User.Password, new { @class = "modal-input" })
          &lt;br /&gt;
          @Html.Label("Role")
          @Html.DropDownListFor(x =&gt; x.User.RoleId, new SelectList(Model.Roles, "Id", "Title"), new { @class = "row-fluid" })
      &lt;/div&gt;
  
      &lt;div class="modal-footer"&gt;
          &lt;a href="#" class="btn" data-dismiss="modal"&gt;Close&lt;/a&gt;
          &lt;input type="submit" value="Create" class="btn btn-primary" /&gt;
      &lt;/div&gt;
      @Scripts.Render("~/bundles/jqueryval")
  }
  </code></pre>
  
  <p><strong>Index View</strong></p>
  
  <pre><code>@model IEnumerable&lt;Phase_3.Models.User&gt;
  &lt;script src="/Content/custom/js/display.modal.js"&gt;&lt;/script&gt;
  
  &lt;div class="row-fluid spacer"&gt;
      &lt;div id="modal-container" class="modal hide fade" data-url='@Url.Action("Create")'&gt;
          &lt;div id="modal-inner"&gt;&lt;/div&gt;
      &lt;/div&gt;
  
  &lt;input type="button" id="display-modal" value="New User" class="btn btn-primary" /&gt;
  &lt;/div&gt;
  
  @* Display users in data table *@
  &lt;div class="row-fluid"&gt;
  
      &lt;table class="table table-condensed table-hover"&gt;
          &lt;tr&gt;
              &lt;th&gt;First Name&lt;/th&gt;
              &lt;th&gt;Last Name&lt;/th&gt;
              &lt;th&gt;Email&lt;/th&gt;
              &lt;th&gt;Role&lt;/th&gt;
          &lt;/tr&gt;
          @foreach (var item in Model)
          {
              &lt;tr&gt;
                  &lt;td&gt;@Html.DisplayFor(x =&gt; item.FirstName)&lt;/td&gt;
                  &lt;td&gt;@Html.DisplayFor(x =&gt; item.LastName)&lt;/td&gt;
                  &lt;td&gt;@Html.DisplayFor(x =&gt; item.Email)&lt;/td&gt;
                  &lt;td&gt;@Html.DisplayFor(x =&gt; item.Role.Title)&lt;/td&gt;
              &lt;/tr&gt;
          }
      &lt;/table&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>Display Errors In Tooltip</strong></p>
  
  <pre><code>$.validator.setDefaults({
  showErrors: function (errorMap, errorList) {
      this.defaultShowErrors();
  
      // destroy tooltips on valid elements                              
      $("." + this.settings.validClass)
          .tooltip("destroy");
  
      // add/update tooltips 
      for (var i = 0; i &lt; errorList.length; i++) {
          var error = errorList[i];
  
          $("#" + error.element.id)
              .tooltip({ trigger: "focus" })
              .attr("data-original-title", error.message)
      }
  }
  });
  </code></pre>