0

次の一連の質問に進む前に、各スライドでフォームを検証しようとしています。

ラジオボタン以外はすべて問題ないようです。ボタンがチェックされていない場合、ボタンのグループに「エラーフォーカス」のクラスを追加しようとしています。答えがチェックされている場合、return $error = false; 以外は何もしません。

ここにフォームがあります http://www.foresightaus.com.au/form/

    $nextBtn.click(function(e){

        e.preventDefault();
        var newIndex = 0,
            currentSlide = $slide.eq(currentIndex),
            $text = currentSlide.find($('li input[type="text"]')),
            $email = currentSlide.find($('#yourEmail')),
            $radio = currentSlide.find($('li.radio-btns')),
            formFields = currentSlide.find("input:text, li.radio-btns"),
            $error = true;  

        formFields.removeClass("error-focus");  

        //-----------------------------------------------------------------
        //-- Validate Text Fields

        $text.each(function(){

            if($(this).val()==""){

                //errorMessage("Please Enter Your Name");
                $(this).focus().addClass("error-focus");
                $error = true;

            }else{

                $error = false;

            }

        }); // end text each

        //-----------------------------------------------------------------
        //-- Validate Email Fields

        if($email.val()==""){

            //errorMessage("Please Enter Your Email Address");
            $(this).focus().addClass("error-focus");
            $error = true;

        }else if(!isValidEmail($email.val())){

            //errorMessage("Please Enter a Correct Email Address");
            $(this).focus().addClass("error-focus");
            $error = true;

        }else{

                $error = false;

        }

        //-----------------------------------------------------------------
        //-- Validate Radio Fields

        $radio.each(function(){

            if (!$(this).find(':checked')) {

               $(this).addClass("error-focus");
               $error = true;

            }

            else {

              $error = false;

            }

        }); // end radio each

        //-----------------------------------------------------------------

        if($error = false){

            if(currentIndex<lastIndex){
                newIndex = currentIndex+1;
            }

            slideToImage(newIndex); 

        }       

    });

    function isValidEmail(email) {
        var emailRx = /^[\w\.-]+@[\w\.-]+\.\w+$/;
        return  emailRx.test(email);
    }
4

2 に答える 2

0

各ラジオ グループの周りに div を追加する必要があります。ラジオ ボタンの 1 つがチェックされていない場合は、他のフィールドに与えている赤い境界線を div に与えるだけです。例：

HTML

<form>
<div id="group-1-wrapper">
<input type="radio">
<input type="radio">
</div>
</form>

js :

if(error) // your handling
$("#group-1-wrapper").addClass("error-focus");
于 2013-03-24T23:55:20.063 に答える
0

私はいくつかの異なる方法を試しましたが、これは私にとってうまくいきました。@Evan正しい方向に向けてくれてありがとう

        //-----------------------------------------------------------------
        //-- Validate Radio Fields

        $radio.each(function(){

            if ($(this).find('input:radio').is(':checked')) {

                $error = false;

            }else{

                $(this).addClass("error-focus");
                $error = true;

            }

        }); // end radio each
于 2013-03-25T00:39:38.187 に答える