라디오 버튼을 사용하여 양식 요소를 표시/숨기기 위해 양식을 편집 할 때 지속성 표시/숨기기

Question

이 코드는 작동하지만 더 나은 방법이 있어야 Jquery 스크립트에서이를 수행 할 수 있습니다.

여기 지금 내 라디오 버튼

<%= f.radio_button :losstype, "Cash", :id => 'lc' %>Cash 
<%= f.radio_button :losstype, "Asset",:id => 'rb' %>Asset 
<%= f.radio_button :losstype, "Supplies", :id => 'ab' %>Supplies 

그리고 heres는 내 숨겨진 비트입니다.

<% if @assetloss.losstype == "Asset" %> 
<div id="asset_list" style="display: show;"> 
<% else %> 
<div id="asset_list" style="display: none;"> 
<% end > 
A drop down list to be shown 
</div> 

그리고 JQuery와 일부 작동하는 동안

<input checked="checked" id="rb" name="asset_loss[loss_type]" type="radio" value="Asset"/> 

, 나는이 할 수있는 더 나은 방법이있을거야, 그래서 나는 것 확인 라디오 버튼을 마크 업을 렌더링

$j(document).ready(function(){ 
    $j("input[id='lc']").change(function() { 
    $j("#asset_list").hide(); 
    }); 
$j("input[id='rb']").change(function() { 
    $j("#asset_list").show("slide"); 
}); 
    $j("input[id='ab']").change(function() { 
    $j("#asset_list").hide(); 
}); 
}); 

리팩터링 도움을 요청할 것입니다.

많은 미리 감사드립니다.

Ed1. 나는 이것이 Jquery Question이라는 것을 깨달았고, "input [id = 'rb']"가 (db로부터) 다음에 $ j ("# asset_list")가 체크되어 있는지 확인해야한다. 변경 리스너를 필요로하지 않고

Answer 1

처음에는 모두 같은 이름으로 그룹화했습니다.

$j("input[name='btnGroupName']").change(function() { 
if($('#rb').is(':checked')) { 
    $j("#asset_list").show("slide"); 
    }else{ 
    $j("#asset_list").hide(); 
    } 
}); 

Answer 2

모든 것을 정돈하고 잡았다 고 말하십시오. 마지막 코드를 heres.

내 라디오 버튼보기.

<%= f.radio_button :loss_type, "cash", :id => 'button_cash',  :class => 'lt'%>Cash 
<%= f.radio_button :loss_type, "asset", :id => 'button_asset', :class => 'lt'%>Asset 
<%= f.radio_button :loss_type, "supplies",:id => 'button_supplies', :class => 'lt'%>Supplies 

당신은 사용할 수 없습니다 이것에 대한 이름은, 라디오 버튼 그룹의 이름은 당신의 데이터가 DB에 저장되지 않습니다 의미 레일 마법과 변화를 사용하여 만들어집니다.

생성 된 이름은 "model [: field]"를 나타내는 name = "asset_loss [loss_type]"입니다. 당신은 이것을 사용할 수 있지만, Jquery는 제대로 캡슐화되지 않은 ""때문에이 문제를 해결할 것입니다. 블록을 의미 예컨대

$j("input[name="asset_loss[loss_type]"]").change(function() { 

는 "입력 [NAME ="및 "]"이며, 작동하지 않는다.

그래서 최종 JQuery와 코드

$j(document).ready(function(){ 
    $j("input[class='lt']").change(function() { 
    if($j('#button_asset').is(':checked')) { 
     $j("#asset_list").show(); 
    }else if ($j('#button_cash').is(':checked')){ 
     $j("#cash_type").show(); 
    }else if($j('#button_supplies').is(':checked')){ 
     // TODO : Partial for stationery 
    } 
}); 

입니다 그리고 이것은 잘 작동합니다. 그러나 끈기의 주요 문제로 돌아갑니다. 이 JQuery 코드는 변경이있을 때만 수행됩니다. 그래서 다시 페이지로 돌아 왔을 때 (또는 다시로드 할 때) db에서 읽지 않습니다. 값이 무엇인지 확인하고 필드를 적절히 표시하거나 숨 깁니다. 이것에 대한

나는 위의 모든 jQuery 코드를 반복하지만

사람이 DRY 의견을 환영하는 방법을 함께 문자열이 두 및 확인을 알고 이제 경우

$j("input[class='lt']").each(function() { 

에

$j("input[class='lt']").change(function() { 

을 변경했습니다. 희망을 가지고이 일을하려는 누군가를 도울 수 있기를 바랍니다.