Xác thực ASP.NET MVC Sử dụng qTip jQuery Plugin

Question

Tôi đang sử dụng giải pháp được tìm thấy here để hiển thị lỗi xác thực phía ứng dụng khách trong chú giải công cụ bằng cách sử dụng plugin qTip jQuery. Giải pháp này hoạt động tuyệt vời để xác thực phía khách hàng nhưng tôi rất thích có thể hiển thị lỗi xác thực phía máy chủ theo cùng một cách. Có ai biết làm thế nào để hiển thị lỗi xác nhận phía máy chủ trong tooltips sử dụng qTip?

Cảm ơn

Answer 1

Nếu có một lỗi xác nhận server-side, khi tải trang sẽ có một phần tử span với lớp 'trường xác nhận lỗi' vì vậy chúng tôi có thể chỉ đơn giản lặp trên tất cả các yếu tố với lớp đó , trích xuất nội dung hoặc thông báo lỗi và hiển thị nó trong một chú giải công cụ.

$(document).ready(function() { 
    // Run this function for all validation error messages 
    $('.field-validation-error').each(function() { 

     // Get the name of the element the error message is intended for 
     // Note: ASP.NET MVC replaces the '[', ']', and '.' characters with an 
     // underscore but the data-valmsg-for value will have the original characters 
     var inputElem = '#' + $(this).attr('data-valmsg-for').replace('.', '_').replace('[', '_').replace(']', '_'); 

     var corners = ['left center', 'right center']; 
     var flipIt = $(inputElem).parents('span.right').length > 0; 

     // Hide the default validation error 
     $(this).addClass('Hidden'); 

     // Show the validation error using qTip 
     $(inputElem).filter(':not(.valid)').qtip({     
      content: { text: $(this).text() } , // Set the content to be the error message 
      position: { 
       my: corners[flipIt ? 0 : 1], 
       at: corners[flipIt ? 1 : 0], 
       viewport: $(window) 
      }, 
      show: { ready: true }, 
      hide: false,     
      style: { classes: 'ui-tooltip-red' } 
     });    
    }); 
}); 

Đây là một blog post giải thích cách thực hiện điều này một cách chi tiết.

Answer 2

Giải pháp được đăng bởi Nick Olsen hoạt động tuyệt vời! Một quan sát:

Các .replace() được sử dụng trong bản Tuyên Bố này chỉ thay thế các lần xuất hiện đầu tiên của ‘.’‘[' và ']‘

var inputElem = ‘#’ + $(this).attr(‘data-valmsg-for’).replace(‘.’, ‘_’).replace(‘[', '_').replace(']‘, ‘_’); 

Để thay thế tất cả các lần xuất hiện dòng nên một cái gì đó như:

var inputElem = "#" + $(this).attr("data-valmsg-for").replace(/\./g,"_").replace(/[\[\]]/g, "_");