Mükemmel bir WordPress kullanmak Validate Plugin bazı formları doğrulamak için kullanıyorum. Bir formda, bu kullanım alanlarından bir grubun en az bir doldurur emin olmak istiyorum. Oldukça iyi bir çözüm buldum ve paylaşmak istedim.Lütfen önermek aklınıza gelebilecek herhangi bir yenilik.

Hayır yerleşik bunu yapmak için bir yol bulmak, ve çok yararlı oldu Rebecca Murphey's custom validation method, arayıp buldum.

Üç şekilde bu geliştirdim:

1. Seni alan grup için bir seçici için izin için
2. Bu grup birçok doğrulama için doldurulmalıdır nasıl geçmek belirtmek için izin ver
3. Doğrulama geçmesine rağmen gruptaki tüm girişler onlardan biri geçsin de göstermek için doğrulama. (- Haykır sonunda Nick Craver.)

Şöyle diyebilirsiniz"en az X Y seçici eşleşen girdiler doldurulmalıdır."

Bu gibi: biçimlendirme ile sonuç

<input class="productinfo" name="partnumber">
<input class="productinfo" name="description">

...bu gibi kurallar bir grup

// Both these inputs input will validate if 
// at least 1 input with class 'productinfo' is filled
partnumber: {
   require_from_group: [1,".productinfo"]
  }
description: {
   require_from_group: [1,".productinfo"]
}

#3 öğe başarılı doğrulama hata iletileri için .checked bir sınıf ekleme olduğunu varsayar. Şu şekilde, as demonstrated here yapabilirsiniz.

success: function(label) {  
        label.html(" ").addClass("checked"); 
}

Olarak demo bağlantılı üstünde kullanıyorum CSS ver her span.error X görüntü olarak onun arka plan, sürece olan sınıf .checked Bu durumda, aldığı bir onay işareti görüntüsü.

İşte benim kod şimdiye kadar:

jQuery.validator.addMethod("require_from_group", function(value, element, options) {
    var numberRequired = options[0];
    var selector = options[1];
    //Look for our selector within the parent form
    var validOrNot = $(selector, element.form).filter(function() {
         // Each field is kept if it has a value
         return $(this).val();
         // Set to true if there are enough, else to false
      }).length >= numberRequired;

    // The elegent part - this element needs to check the others that match the
    // selector, but we don't want to set off a feedback loop where each element
    // has to check each other element. It would be like:
    // Element 1: "I might be valid if you're valid. Are you?"
    // Element 2: "Let's see. I might be valid if YOU'RE valid. Are you?"
    // Element 1: "Let's see. I might be valid if YOU'RE valid. Are you?"
    // ...etc, until we get a "too much recursion" error.
    //
    // So instead we
    //  1) Flag all matching elements as 'currently being validated'
    //  using jQuery's .data()
    //  2) Re-run validation on each of them. Since the others are now
    //     flagged as being in the process, they will skip this section,
    //     and therefore won't turn around and validate everything else
    //  3) Once that's done, we remove the 'currently being validated' flag
    //     from all the elements
    if(!$(element).data('being_validated')) {
    var fields = $(selector, element.form);
    fields.data('being_validated', true);
    // .valid() means "validate using all applicable rules" (which 
    // includes this one)
    fields.valid();
    fields.data('being_validated', false);
    }
    return validOrNot;
    // {0} below is the 0th item in the options field
    }, jQuery.format("Please fill out at least {0} of these fields."));

Yaşasın!

Haykır

Şimdilik bu alkış - aslında, benim kod sadece körü körüne sakladı hata iletileri diğer eşleşen alanları yerine yeniden değerlendirilmesi onları, demek ki orada başka bir sorun ('sadece sayı izin verilir ve girdiğiniz harfler'), almış kadar gizli kullanıcı çalıştı gönderin. Bu geri besleme döngüsü yorum yukarıda bahsedilen önlemek için nasıl bilmiyordum çünkü. Bir yolu olması gerektiğini biliyordum, ** 19 Nick Craver beni aydınlattı. Teşekkürler, Nick.

Soru Çözüldü

Bu aslında "beni bu hisse eğer birisi" tarzı bir soru. iyileştirmeler önerebilirsiniz bakalım bir oldu Hala bir geri bildirim hoş geldiniz " demek isterdim, ancak bu noktada çok eksiksiz olduğunu düşünüyorum. (Daha kısa olabilir, ama bunu mutlaka oku özlü kolay olmasını istiyorum.) Bu yüzden sadece keyfini çıkarın!

Güncelleme - jQuery Doğrulama bir parçası artık

Bu officially added to jQuery Validation 4/3/2012.

Bu mükemmel bir çözüm Nathan. Çok teşekkürler.

İşte yukarıdaki kod birileri benim gibi sıkıntı içine entegre çalışır durumda iş yapmak:

Bu kod içindeadditional-methods.jsdosya:

jQuery.validator.addMethod("require_from_group", function(value, element, options) {
...// Nathan's code without any changes
}, jQuery.format("Please fill out at least {0} of these fields."));

// "filone" is the class we will use for the input elements at this example
jQuery.validator.addClassRules("fillone", {
    require_from_group: [1,".fillone"]
});

Bu kod içindehtmldosya:

<input id="field1" class="fillone" type="text" value="" name="field1" />
<input id="field2" class="fillone" type="text" value="" name="field2" />
<input id="field3" class="fillone" type="text" value="" name="field3" />
<input id="field4" class="fillone" type="text" value="" name="field4" />

Additional-methods.js dosya! eklemeyi unutmayın