programing

jquery를 사용하여 라디오 버튼 선택값을 설정하는 방법

newnotes 2023. 9. 7. 22:01
반응형

jquery를 사용하여 라디오 버튼 선택값을 설정하는 방법

javascript에서 라디오 버튼 선택값을 설정하는 방법:

HTML 코드:

<input type="radio" name="RBLExperienceApplicable" class="radio" value="1" > 
<input type="radio" name="RBLExperienceApplicable" class="radio" value="0" >


<input type="radio" name="RBLExperienceApplicable2" class="radio" value="1" > 
<input type="radio" name="RBLExperienceApplicable2" class="radio" value="0" >

ASPX 코드

     <asp:RadioButtonList ID="RBLExperienceApplicable" runat="server" class="radio"    RepeatDirection="Horizontal" EnableViewState="false">
            <asp:ListItem Value="1" Text="Yes &nbsp;&nbsp;"></asp:ListItem> 
                <asp:ListItem Value="0" Text="No"></asp:ListItem>
        </asp:RadioButtonList>

     <asp:RadioButtonList ID="RBLExperienceApplicable2" runat="server" class="radio"  RepeatDirection="Horizontal" EnableViewState="false">
            <asp:ListItem Value="1" Text="Yes &nbsp;&nbsp;"></asp:ListItem> 
                <asp:ListItem Value="0" Text="No"></asp:ListItem>
        </asp:RadioButtonList>

// DB에서 일부 코드 가져오기
// db 값에 따라 스크립트 블록이 실행됩니다.

 <script type="text/javascript">
        RadionButtonSelectedValueSet('1');
 </script>

스크립트 블록:

function RadionButtonSelectedValueSet(SelectdValue) {
    $('#RBLExperienceApplicable').val(SelectdValue);
        //$("input[name='RBLExperienceApplicable']:checked").val(SelectdValue);
}

해라

function RadionButtonSelectedValueSet(name, SelectdValue) {
    $('input[name="' + name+ '"][value="' + SelectdValue + '"]').prop('checked', true);
}

또한 dom ready에서 method 호출

<script type="text/javascript">
jQuery(function(){
    RadionButtonSelectedValueSet('RBLExperienceApplicable', '1');
})
</script>

더 우아하게 할 수 있습니다.

function RadionButtonSelectedValueSet(name, SelectedValue) {
    $('input[name="' + name+ '"]').val([SelectedValue]);
}

이것도 시도해보실 수 있습니다.

function SetRadiobuttonValue(selectedValue)
{
  $(':radio[value="' + selectedValue + '"]').attr('checked', 'checked');
}

아래 스크립트는 모든 브라우저에서 정상적으로 작동합니다.

function RadionButtonSelectedValueSet(name, SelectdValue) {
     $('input[name="' + name + '"][value="' + SelectdValue + '"]').attr('checked',true);
}
$('input[name="RBLExperienceApplicable"]').prop('checked',true);

고마워 임마...

선택사항이 바뀌면 다른 체크를 먼저 지워야 합니다.

$('input[name="' + value.id + '"]').attr('checked', false);
$('input[name="' + value.id + '"][value="' + thing[value.prop] + '"]').attr('checked',  true);
               

여러 드롭다운의 경우

$('[id^=RBLExperienceApplicable][value='+ SelectedVAlue +']').attr("checked","checked");

여기서RBLExperienceApplicable는 라디오 버튼 그룹 입력 태그 ID의 일치하는 부분입니다.[id^=RBLExperienceApplicable]ID가 시작하는 모든 라디오 버튼과 일치합니다.RBLExperienceApplicable

  <input type="radio" name="RBLExperienceApplicable" class="radio" value="1" checked > 
 //       For Example it is checked
 <input type="radio" name="RBLExperienceApplicable" class="radio" value="0" >


<input type="radio" name="RBLExperienceApplicable2" class="radio" value="1" > 
<input type="radio" name="RBLExperienceApplicable2" class="radio" value="0" >


      $( "input[type='radio']" ).change(function() //on change radio buttons
   {


    alert('Test');
   if($('input[name=RBLExperienceApplicable]:checked').val() != '') //Testing value
 {

$('input[name=RBLExperienceApplicable]:checked').val('Your value Without Quotes');

}
    });

http://jsfiddle.net/6d6FJ/1/ 데모

enter image description here

  <asp:RadioButtonList ID="rblRequestType">
        <asp:ListItem Selected="True" Value="value1">Value1</asp:ListItem>
        <asp:ListItem Value="Value2">Value2</asp:ListItem>
  </asp:RadioButtonList>

체크는 이렇게 설정하시면 됩니다.

var radio0 = $("#rblRequestType_0");
var radio1 = $("#rblRequestType_1");

radio0.checked = true;
radio1.checked = true;

내가 찾은 깨끗한 접근법은ID각 라디오 버튼에 대해 다음 명령을 사용하여 설정합니다.

document.getElementById('publicedit').checked = true;

이것이 내게 맞는 유일한 구문입니다.

$('input[name="assReq"][value="' + obj["AssociationReq"] + '"]').prop('checked', 'checked');

요소의 ID를 사용하여 수행할 수 있습니다.

<label><input type="radio" name="travel_mode"  value="Flight" id="Flight"> Flight </label>
<label><input type="radio" name="travel_mode"  value="Train" id="Train"> Train </label>
<label><input type="radio" name="travel_mode"  value="Bus" id="Bus"> Bus </label>
<label><input type="radio" name="travel_mode"  value="Road" id="Road"> Other </label>

js:

$('#' + selected).prop('checked',true);
document.getElementById("TestToggleRadioButtonList").rows[0].cells[0].childNodes[0].checked = true;

어디에TestToggleRadioButtonList는 아이디 입니다.RadioButtonList.

언급URL : https://stackoverflow.com/questions/19294001/how-to-set-radio-button-selected-value-using-jquery

반응형