2013-03-22 7 views
0

부분보기에서 부트 스트랩 모달을가집니다. 내 인덱스보기에서 단추를 클릭하면 현재 페이지에 부분보기 모달이 표시됩니다. Jquery 유효성 검사는 부트 스트랩 툴팁에 유효성 검사 오류를 표시하도록 설정됩니다. 이 툴팁은 모든 페이지에서 렌더링 된 부분 뷰에 훌륭하게 표시됩니다.부트 스트랩 툴팁이 Ajax 렌더링 된 부분 뷰에서 표시되지 않음

모달보다 큰 것으로 툴팁의 Z- 인덱스를 설정하려고 시도했지만 작동하지 않습니다.

부분보기 툴팁

$.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 < errorList.length; i++) { 
     var error = errorList[i]; 

     $("#" + error.element.id) 
      .tooltip({ trigger: "focus" }) 
      .attr("data-original-title", error.message) 
    } 
} 
}); 
+0

해결책을 찾았습니까? – Stnfordly

답변

1

이을에

@model Phase_3.ViewModels.UserCreateViewModel 

<div class="modal-header"> 
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button> 
    <h3>New User</h3> 
</div> 
@using (Html.BeginForm("Create", "User", FormMethod.Post, new { @class = "remove-margin" })) 
{ 
    <div class="modal-body"> 

     @Html.Label("First Name", new { @class = "inline" }) @Html.ValidationMessageFor(x => x.User.FirstName) 
     @Html.TextBoxFor(x => x.User.FirstName, new { @class = "modal-input input-validation-error" }) 

     <br /> 
     @Html.Label("Last Name") 
     @Html.TextBoxFor(x => x.User.LastName, new { @class = "modal-input" }) 
     <br /> 
     @Html.Label("Email") 
     @Html.TextBoxFor(x => x.User.Email, new { @class = "modal-input" }) 
     <br /> 

     @* REMOVE WHEN RANDOM SALT METHOD IS COMPLETED*@ 
     @Html.Label("Salt") 
     @Html.TextBoxFor(x => x.User.Salt, new { @class = "modal-input" }) 
     <br /> 
     @Html.Label("Password") 
     @Html.TextBoxFor(x => x.User.Password, new { @class = "modal-input" }) 
     <br /> 
     @Html.Label("Role") 
     @Html.DropDownListFor(x => x.User.RoleId, new SelectList(Model.Roles, "Id", "Title"), new { @class = "row-fluid" }) 
    </div> 

    <div class="modal-footer"> 
     <a href="#" class="btn" data-dismiss="modal">Close</a> 
     <input type="submit" value="Create" class="btn btn-primary" /> 
    </div> 
    @Scripts.Render("~/bundles/jqueryval") 
} 

인덱스보기

@model IEnumerable<Phase_3.Models.User> 
<script src="/Content/custom/js/display.modal.js"></script> 

<div class="row-fluid spacer"> 
    <div id="modal-container" class="modal hide fade" data-url='@Url.Action("Create")'> 
     <div id="modal-inner"></div> 
    </div> 

<input type="button" id="display-modal" value="New User" class="btn btn-primary" /> 
</div> 

@* Display users in data table *@ 
<div class="row-fluid"> 

    <table class="table table-condensed table-hover"> 
     <tr> 
      <th>First Name</th> 
      <th>Last Name</th> 
      <th>Email</th> 
      <th>Role</th> 
     </tr> 
     @foreach (var item in Model) 
     { 
      <tr> 
       <td>@Html.DisplayFor(x => item.FirstName)</td> 
       <td>@Html.DisplayFor(x => item.LastName)</td> 
       <td>@Html.DisplayFor(x => item.Email)</td> 
       <td>@Html.DisplayFor(x => item.Role.Title)</td> 
      </tr> 
     } 
    </table> 
</div> 

표시 오류 문제는 페이지의 초기로드시 도구 설명 (실행 코드 $.validator.setDefaults)을 한 번 초기화하는 것이 원인 일 수 있습니다. ajax 호출 후 모든 툴팁을 다시 초기화하십시오 : success 함수에서.

+0

나는 똑같은 문제를 겪고있다. 이것은 정답과 같다. 필자의 경우 - 테이블에 동적으로 생성 된 많은 툴팁이 있습니다. AJAX 호출에 의해 테이블이 여러 로 렌더링 된 후에 jquery가 모든 것을 인식하도록하려면 어떻게해야합니까? – Stnfordly

관련 문제