2009-03-16 30 views
15

Dạng HTML sau sử dụng thành công hình thức xác nhận của jQuery, hiển thị "lĩnh vực này là cần thiết" ở bên phải của trường mẫu nếu để trống, và "Vui lòng nhập ít nhất 2 ký tự" nếu ít hơn 2 ký tự đã được nhập. Tuy nhiên, thay vì các siêu dữ liệu xác nhận được chỉ định sử dụng các lớp và MINLENGTH thuộc tính trên "cname" trường mẫu đầu vào, tôi muốn sử dụng "quy tắc" API của jQuery thay vào đó, nơi các quy tắc được quy định trong cơ thể của hàm validate. Cảm ơn trước:đơn giản JQuery xác nhận quy tắc dụ

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
        "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
    <script src="/lib/js/jquery.js"></script> 
    <script src="/lib/js/jquery.validate.js"></script> 
    <script> 
    $(document).ready(function(){$("#commentForm").validate(
    /* 
    rules/messages here 
    */ 
    );} 
    ); 
    </script> 
</head> 
<body> 

<form id="commentForm" method="get" action=""> 
<fieldset> 
    <legend>A simple comment form with submit validation and default messages</legend> 
    <p> 
    <label for="cname">Name</label> 
    <em>*</em><input id="cname" name="name" size="25" class="required" minlength="2" /> 
    </p> 
    <p> 
    <input class="submit" type="submit" value="Submit"/> 
    </p> 
</fieldset> 
</form> 
</body> 
</html> 
+0

Tôi thấy nó rất hữu ích – Mike

+3

Đóng câu hỏi này là "có vấn đề" –

+0

Xin lỗi nếu bỏ phiếu để mở lại câu hỏi của tôi có vẻ tự phục vụ. Tôi sẽ hủy bỏ phiếu bầu của mình nếu tôi nhận được huy hiệu "bạch kim" mới để đặt câu hỏi đã đóng nhưng vẫn nhận được 100 nghìn lượt xem (ít hơn 12 nghìn lượt xem kể từ tháng 7 năm 2013). Ngay cả khi câu hỏi này không có thêm câu trả lời, tôi không nghĩ rằng nó nên có "sự kỳ thị" là một câu hỏi kín. –

Trả lời

12

Ví dụ có trong this blog post thực hiện thủ thuật.

+2

Tôi đang chủ động và thêm một liên kết đến bài viết lưu trữ trên web.archive.org trong trường hợp liên kết ban đầu bao giờ chết: http://web.archive.org/web/20120108075037/http://www.raymondcamden.com/index.cfm/2009/ 2/10/An-Giới thiệu-to-jQuery-và-Form-Validation-2 –

+2

Bạn nên dọn dẹp liên kết này chỉ trả lời. – paqogomez

13
rules: { 
    cname: { 
     required: true, 
     minlength: 2 
    } 
}, 
messages: { 
    cname: { 
     required: "<li>Please enter a name.</li>", 
     minlength: "<li>Your name is not long enough.</li>" 
    } 
} 
+0

Hi tôi đánh giá cao nỗ lực của bạn. Tuy nhiên tôi không thể làm cho nó hoạt động được. Tôi thực sự đã thử một cái gì đó khá nhiều giống như thế này nhiều lần trước đây, đó là lý do tại sao tôi đăng ở đây trên SO. Đang chỉnh sửa câu hỏi ban đầu để chỉ ra vị trí của file HTML Tôi đã tải lên một trong những trang web của tôi –

+1

Ok, cần phải có một dấu phẩy ở cuối của khối nguyên tắc, trước khi các tin nhắn chặn, và dấu ngoặc nhọn xung quanh cả hai khối. Điều này khắc phục lỗi Javascript đơn giản, và tôi đã cập nhật các tập tin HTML-2 trực tuyến, nhưng xác nhận vẫn không hoạt động :(Tôi chắc chắn nó đơn giản, chỉ cần vượt qua điều này –

1
$("#commentForm").validate({ 
    rules: { 
    cname : { required : true, minlength: 2 } 
    } 
}); 

nên được một cái gì đó như thế, tôi đã chỉ cần gõ chữ này lên trong trình soạn thảo ở đây để có thể là một lỗi cú pháp hoặc hai, nhưng bạn sẽ có thể làm theo mẫu và documentation

0

Các đầu vào trong đánh dấu là mất tích "type", đầu vào (văn bản tôi giả sử) có thuộc tính name="name"ID="cname", các mã được cung cấp bởi Ayo gọi là đầu vào có tên là "cname" * nơi nó nên "tên".

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