logo

Thông báo

Icon
Error

Chia sẻ
Tùy chọn
Xem
Xem bài viết cuối
Offline Ellry  
#1 Đã gửi : 29/03/2017 lúc 11:33:14(UTC)
Ellry


Danh hiệu: Advanced Member

Chức danh:

Nhóm: Moderator
Gia nhập: 05-10-2015(UTC)
Bài viết: 7,494
Woman
Viet Nam
Đến từ: Tp. Hồ Chí Minh

Được cảm ơn: 21 lần trong 17 bài viết

Ví dụ về bắt buộc chọn ít nhất 1 trong list checkbox

Mã:
<form name="itemForm" id="itemForm" method="post">
    <p>
      <input name="resp01" type="radio" value="sim" id="resp01-sim" class="resp" /> <label for="resp01-sim">Sim</label>
      <input name="resp01" type="radio" value="não" id="resp01-nao" class="resp" /> <label for="resp01-nao">Não</label>
    </p>
    <fieldset style="width:200px"><legend>Outros catalogos</legend>
    <input id="opt01" name="opt01" type="checkbox" value="true" class="require-one" />
    <label for="opt01">opt01</label>
    <input name="opt01" type="hidden" value="false" /><br />
    
    <input id="opt02" name="opt02" type="checkbox" value="true" class="require-one" />
    <label for="opt02">opt02</label>
    <input name="river2" type="hidden" value="false" /><br />
    
    <input id="opt03" name="opt03" type="checkbox" value="true" class="require-one" />
    <label for="opt03">opt03</label>
    <input name="opt03" type="hidden" value="false" /><br />
    </fieldset>
    <div class="error" id="form_error"></div>
    <br />
    <input type="submit" />
</form>

Mã:
$.validator.addMethod('require-one', function(value) {
    if ($('#resp01-sim').is(':checked')) {
        return $('.require-one:checked').size() > 0;
    } else {
        return true;
    }
}, 'Selecione pelo menos uma das opções.');

$(document).ready(function(){          var checkboxes = $('.require-one');     var checkbox_names = $.map(checkboxes, function(e, i) {         return $(e).attr("name")     }).join(" ");          $("#itemForm").validate({         groups: {             checks: checkbox_names         },         rules: {             resp01: 'required',         },         messages: {             resp01:  { required: 'Selecione uma resposta!' },         },         errorPlacement: function(error, element) {             $('#form_error').append(error);         },         submitHandler: function(form) {             alert('Form Submited');             return false;         }                  }); });

Mã:
* { 
    font-family: Verdana; 
    font-size: 96%; 
}
label.error { 
    float: none; 
    color: red; 
    margin: 0 .5em 0 0; 
    vertical-align: top; 
    font-size: 10px; 
    display:block 
}

Link demo : http://jsfiddle.net/TnmGr/4/

Ai đang xem chủ đề này?
OceanSpiders 2.0
Chủ đề tương tự
Nguyên tắc SOLID và ví dụ vi phạm quy tắc SOLID (Kỹ thuật lập trình)
Bởi admin 01-08-2019 lúc 02:36:16(UTC)
Giải thích trừu tượng, ví dụ cụ thể (Truyện trẻ con)
Bởi admin 07-11-2013 lúc 03:25:03(UTC)
Di chuyển  
Bạn không thể tạo chủ đề mới trong diễn đàn này.
Bạn không thể trả lời chủ đề trong diễn đàn này.
Bạn không thể xóa bài của bạn trong diễn đàn này.
Bạn không thể sửa bài của bạn trong diễn đàn này.
Bạn không thể tạo bình chọn trong diễn đàn này.
Bạn không thể bỏ phiếu bình chọn trong diễn đàn này.

| Cung cấp bởi YAF.NET 2.2.4.14 | YAF.NET © 2003-2021, Yet Another Forum.NET
Thời gian xử lý trang này hết 0.876 giây.