开发者

jquery validate on slider

Form has several sliders along with other inputs.

All other inputs validates find, but having problem validating jquery slider

Code to add slider

$(".jSlider").each(function(){
   var id = $(this).attr("id");
   var sliderID = id + "_slider";   
    var newSlider = '<div style="padding-top:30px;padding-right:10px;background: #fff url(/images/scrollerBg.png) no-repeat;" id="sliderContainer" ><d开发者_如何学Goiv style="background: #555" id="slider"></div></div><br />';
    $(this).append(newSlider);
   $(this).closest('fieldset').find('input:text').css("display", "none");
    $("#slider", this).slider({
        value:0,
        min: 0,
        max: 10,
        orientation: "horizontal",
        range: "min",
        step: 1,
        animate: true,
        change: function( event, ui ) {
            $(this).closest('fieldset').find('input:text').val(ui.value);
              // was adding error manually cause of background image being used
            $(this).closest('fieldset').find('div.jSliderError').slideUp('fast', function(){
                $(this).remove();
            });
            }

    });

  });

Here is one of the fieldsets that get generated

<fieldset class="q_default required jSlider fixFirefox" id="q_423" name="8) On a scale of 0 to 10 how did you like it?"><legend><span>8) On a scale of 0 to 10 how did you like it?</span></legend><ol><span class='help'></span>
    <input id="r_8_question_id" name="r[8][question_id]" type="hidden" value="423" />


    <input class="" id="r_8_answer_id" name="r[8][answer_id]" type="hidden" value="8782" />
    <li class="string optional" id="r_8_string_value_input"><input id="r_8_string_value" maxlength="255" name="r[8][string_value]" type="text" /></li>
    </ol></fieldset>


Two things I notice:

1: You are declaring $("#slider", this).slider({.. inside an $.each() which means you could be overwriting your parameters on #slider each iteration.

2: You are using $(this).closest('fieldset').find('input:text').val(ui.value); inside the change: function(){} which might not be traversing correctly, especially if it's looking for #select and there are more than one.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜