2014-03-04 1 views
1

이 플러그인을 사용하여 슬라이더의 유효성을 검사하도록 만들 수 없습니다. 아무도 도와 드릴 수 있습니까?jQuery-Validation-Engine-> 슬라이더 위치 유효성 검사

숨겨진 필드와 슬라이더 div에 유효성 검사를 시도했지만 두 경우 모두 유효성을 검사하지 않습니다.

HTML :

As a security measure, please drag the slider below to the right, or use 
the right arrow on the keyboard, until the color changes.<span class="required" 
id="slider_required">(required)</span> 
<input type="hidden" name="CSlider" id="CSlider" value="0" /> 
<br /> 
<div id="slider" class="validate[required,funcCall[sliderCheck]]"></div> 

Javacript :

$(document).ready(function() { 
    $("#slider").slider({ 
     value: 0, 
     min: 0, 
     max: 1, 
     step: 1, 
     slide: function (event, ui) { 
      $("#CSlider").val(ui.value); 
      // Don't need the color change for the thumb 
      if (ui.value == 1) { 
       $("#slider").children("a").css("background", "#48B"); 
       $("#slider").css("background", "#F7F6F1"); 
      } else { 
       $("#slider").children("a").css("background", "#F7F6F1"); 
       $("#slider").css("background", "#F7F6F1"); 
      } 
     } 
    }); 
}); 

function sliderCheck(field, rules, i, options) { 
    if(field.val() != 1) { 
     return options.allrules.validate2field.alertText; 
    } 
} 

CSS : 나는 다른 사람이 게시하는 것은 보는 방법, 알아 냈

#slider { 
    display:inline-block; 
    background-position:left top; 
    background-repeat:repeat-x; 
    border:1px solid #ccc; 
    float:left; 
    margin-left: 25px; 
    padding:0; 
    width:120px; 
    }  

답변

1

.

슬라이더가 초기화 된 후, 검증 기능에 앵커의 흐림을 결합해야합니다

function sliderCheck() { 
    if($("#CSlider").val() != 1) { 
     $('#slider').validationEngine('showPrompt', 'Please move the slider to the right before submitting the form'); 
    } 
} 
:

$("#slider").children("a").bind("blur", sliderCheck); 

그런 다음 슬라이더 사업부에 대한 프롬프트를 표시