TYPEA
ユーザーが personとの 2 つのオプションから選択できるようにするコードがありますTYPEB
。
SELECT PERSON - { TYPEA, TYPEB }
選択に応じて、次のように表示されます。
TYPEA - { TYPEA WITH ID, TYPEA WITHOUT ID }
TYPEB - { TYPEB WITH ID, TYPEB WITHOUT ID }
これで動作しています:
html:
<div id="person-A-withID" class="persons" style="display:none"></div>
<div id="person-A-withoutID" class="persons" style="display:none"></div>
<div id="person-B-withID" class="persons" style="display:none"></div>
<div id="person-B-withoutID" class="persons" style="display:none"></div>
jQuery:
$(function () {
$('#has_id').show();
$('#select_person').change(function () {
$('.persons').hide();
if ($('#select_person').val() == 'typeA') {
$("#has_id").html('');
$("<option/>").val('0').text('--Choose Type A--').appendTo("#has_id");
$("<option/>").val('person-A-withID').text('person-A-withID').appendTo("#has_id");
$("<option/>").val('person-A-withoutID').text('person-A-withoutID').appendTo("#has_id");
}
if ($('#select_person').val() == 'typeB') {
$("#has_id").html('');
$("<option/>").val('0').text('--Choose Type B--').appendTo("#has_id");
$("<option/>").val('person-B-withID').text('person-B-withID').appendTo("#has_id");
$("<option/>").val('person-B-withoutID').text('person-B-withoutID').appendTo("#has_id");
}
});
$('#has_id').change(function () {
$('.persons').hide();
$('#' + $(this).val()).show();
});
});
次のコードを使用して、値が空か 0 かどうかを検証する関数があります。
function validate(id, msg) {
//search object
var obj = $('#' + id);
if(obj.val() == '0' || obj.val() == ''){
//append error to particular div called #id__field_box
$("#" + id + "_field_box .form-error").html(msg)
return true;
}
return false;
}
そして、次のように検証関数内で呼び出します。
var validation = function(){
var err = 0;
err += validate('select_person', "select person.");
//err += validate($('#select_person:first-child').attr('has_id'), "Select wether it has ID or not.");
//err += validate('has_id', "Select wether it has ID or not.");
if(err == 0){
//continue
}else{
//stop
}
};
問題は、has_id
パーツを検証できないことです。最初のパーツしか検証できません。を検索するためにどのように使用できhas_id
ますか?