2016-04-07 10 views
0

ラベル名がA & Bの2つのラジオボタンとクラス名がgroupAとgroupBの2つのグループのテキストボックスがあります。ユーザーがラジオボタンAをチェックすると、グループBのテキストボックスは消去され、ユーザーがラジオボタンBをチェックすると、グループBのテキストボックスは再び元の値で満たされ、グループAのテキストボックスの値は消去されます。このため、class.Butに基づいてテキストボックスの値をクリアすることができますが、ユーザがラジオボタンの1つをチェックしたときに以前の値をすべて埋める方法は?以下は私のコードです。ラジオボタンは、入力値のチェックとアンチェックを行います。

jQuery(function(){ 
    jQuery("#id1").click(function() {  
      jQuery(".groupB").each(function() 
      { 
       jQuery('input.groupB[type="text"]').val(''); 
      }); 
     } 
    }); 

jQuery("#id2").click(function() {  
      jQuery(".groupA").each(function() 
      { 
       jQuery('input.groupA[type="text"]').val(''); 
      }); 
     } 
    }); 

}); 

ご協力いただければ幸いです。

+0

あなたがjsfiddle.netにあなたのコードの作業バージョンを作成できますか?私が取るアプローチは、隠しフィールドにテキストボックスの以前の値を格納することです。 –

+0

こんにちは、これについては、私はjsfiddle.netでこれを行う方法がわからないので、ごめんなさい。あなたの迅速なresposneをありがとう。 – user3408779

+0

jQueryのどのバージョンを使用していますか? –

答えて

1

あなたのHTMLが表示されていないため、正しいフィールドがあるかわかりません。

<body> 
    <form> 
    <input id="id1" type="radio" name="test" value="A" />Group A 
    <input type="hidden" name="hidden_a1" /> 
    <input type="hidden" name="hidden_a2" /> 
    <input class="groupA" type="text" name="text_a1" disabled="disabled" /> 
    <input class="groupA" type="text" name="text_a2" disabled="disabled" /> 
    <br /> 
    <input id="id2" type="radio" name="test" value="B" />Group B 
    <input type="hidden" name="hidden_b1" /> 
    <input type="hidden" name="hidden_b2" /> 
    <input class="groupB" type="text" name="text_b1" disabled="disabled" /> 
    <input class="groupB" type="text" name="text_b2" disabled="disabled" /> 
    </form> 
</body> 

、ここJavaScriptコードは次のとおりです:しかし、ここで私が思い付いたものです

$(document).ready(function() { 
    $('#id1').on('click', { 
    show: 'A', 
    hide: 'B' 
    }, choose_group); 
    $('#id2').on('click', { 
    show: 'B', 
    hide: 'A' 
    }, choose_group); 
}); 

function choose_group(event) { 
    $('.group' + event.data.show).each(function(index) { 
    $(this).prop('value', $('[name="' + $(this).prop('name').replace('text', 'hidden') + '"]').prop('value')); 
    $(this).prop('disabled', false); 
    }); 
    $('.group' + event.data.hide).each(function(index) { 
    $('[name="' + $(this).prop('name').replace('text', 'hidden') + '"]').prop('value', 
     $(this).prop('value')); 
    $(this).prop('value', ''); 
    $(this).prop('disabled', true); 
    }); 
} 
+0

ここで試してみることができます:https://jsfiddle.net/RocketDave/a38yt3yy/2/ –

+0

HI David、ありがとう、これは私のために働く.. – user3408779

関連する問題