0

私は奇妙な問題に遭遇しています。

私はJqueryモバイルとよく知られている検証プラグインを使用しています。データネイティブ属性を false に変更する場合を除いて、すべて正常に動作します。送信時にエラー メッセージが表示されますが、変更時に消えることはありません。私は何かが足りないのですか？更新 1: もっと奇妙です。エラー メッセージまたは送信ボタンをクリックすると更新されます。

html コード:

<div id="invalid-id_form_choose" class="errors"></div>
        <select id="id_form_choose" name="question" data-theme="b" data-native-menu="false" class="question">
            <option value="">Veuillez choisir</option>
<option  value="FIRST_PET_NAME">Quel est le nom de votre premier animal de compagnie ?/option>
<option  value="MOTHER_PLACE_OF_BIRTH">Dans quelle ville est née votre mère ?</option> 
        </select>

JS コード:

jQuery.validator.addClassRules({
    question:{
       required: true
    }
});
jQuery.validator.setDefaults({
errorPlacement: function(error, element) {

        error.appendTo('#invalid-' + element.attr('id'));


}
});
$(document).bind('pageinit',function(){
  $("#step1_form").validate({
     messages:{
         question:{
            required: "Veuillez renseigner ce champ obligatoire"
        }

    }
});

CSS コード

.errors{
    color:red;
}
4

2 に答える 2

1

data-native=false元の選択ボックスを非表示にします。

検証するには、隠しフィールドの検証を有効にする必要があります。

詳細については、こちらをご覧ください: jQuery Validate - 非表示フィールドの検証を有効にする

于 2013-07-22T10:25:24.407 に答える
0

さて、私は私の問題の解決策を見つけました。これは間違いなくうまくいきます

github https://github.com/anumonk/mobileFormValidationでこのクールなコードを見つけた ので、次のように変更しました

この関数を JS コードに追加しました

function handleChangeEvent( event ) {
    // code based on the jQuery validation framework
    var validator = $.data( this[0].form, "validator" );
    validator.element( this[0] );
};

$("#step1_form").validate このコードの直前

changeEventTargets = "[type='radio'], [type='checkbox'], select, option";
$("#step1_form").validateDelegate( changeEventTargets, "change", handleChangeEvent );

同じケースで、他の人に役立つことを願っています。

于 2013-07-25T11:57:09.900 に答える