2010-03-24 34 views
13

Tôi đang làm việc với plugin Xác thực jQuery và tôi đã viết đoạn mã sau để thêm lớp vào phụ huynh (<input>) của phần tử (nếu không hợp lệ, cũng như chèn phần tử lỗi thực tế (<span>) trước <br>.Plugin Xác thực jQuery: thêm/xóa lớp vào/khỏi vùng chứa lỗi của phần tử

HTML ...

<label> 
    text<br><input> 
</label> 

... và jQuery.

$("#form_to_validate").validate({ 
    rules: { 
    ... 
    }, 
    errorElement: "span", 
    errorPlacement: function(error, element) { 
     element.parent().addClass('error'); 
     error.insertBefore(element.parent().children("br")); 
    } 
}); 

Vì vậy, nếu một yếu tố hình thức không xác nhận, nó biến thành:

<label class="error"> 
    text<span>error text</span><br><input> 
</label> 

này hoạt động tuyệt vời, tuy nhiên, nếu nội dung của một trường được điều chỉnh và có hiệu lực, các lớp rõ ràng doesn' t được lấy ra từ cha mẹ của nó (thực sự, không phải là yếu tố lỗi, thay vào đó nó chỉ nhận được một tài sản CSS display: none;). Làm thế nào tôi có thể kiểm tra xem một phần tử có hợp lệ không và loại bỏ lớp cha của nó nếu vậy?

Bất kỳ trợ giúp nào sẽ được đánh giá rất nhiều!


Đã chỉnh sửa: Đã thêm thông tin.

Trả lời

29

Sau một số lần đào bới nặng hơn, tôi tìm thấy câu trả lời ngay dưới mũi tôi, nhưng thật không may cho tôi, cũng bị ẩn. Trình cắm có chức năng đánh dấu tích hợp (ngạc nhiên, bất ngờ). Thông thường nó sẽ làm nổi bật/bỏ ánh sáng yếu tố, nhưng nó có thể dễ dàng được chuyển đổi để hoạt động trên phụ huynh của phần tử:

$("#form_to_validate").validate({ 
    rules: { 
    ... 
    }, 
    errorElement: "span", 
    errorPlacement: function(error, element) { 
     error.insertBefore(element.parent().children("br")); 
    }, 
    highlight: function(element) { 
     $(element).parent().addClass("error"); 
    }, 
    unhighlight: function(element) { 
     $(element).parent().removeClass("error"); 
    } 
}); 

Tôi hy vọng điều này sẽ giúp ai đó!

+0

bạn đã lưu thời gian của tôi: P Cảm ơn – researcher

0

errorElement: 'none' làm việc cho tôi.

Các vấn đề liên quan