Работа над значением переключателя и текстом в jquery и ajax

#jquery

#jquery

Вопрос:

Я пытаюсь получить текст переключателя и установить его в качестве текста для . Кроме того, я хотел бы передать значение переключателя в ajax.

Вот шаблон:

    <div id="div_id_feature_selection" class="form-group">
        <label for="id_feature_selection_0" class=" requiredField">
              Feature selection<span class="asteriskField">*</span>
        </label>
        <div class="">
             <div class="form-check">
                 <input type="radio" class="form-check-input" name="radio_selection" id="id_radio_selection_1" value="rdoSel1" >
                 <label for="id_radio_selection_1" class="form-check-label">
                      Radio Selection 1
                 </label>
             </div>

             <div class="form-check">
                 <input type="radio" class="form-check-input" name="radio_selection" id="id_radio_selection_2" value="rdoSel2" >
                 <label for="id_radio_selection_2" class="form-check-label">
                      Radio Selection 2
                 </label>
             </div>

             <div class="form-check">
                 <input type="radio" class="form-check-input" name="radio_selection" id="id_radio_selection_3" value="rdoSel3" >
                 <label for="id_radio_selection_3" class="form-check-label">
                      Radio Selection 3
                 </label>
             </div>
        </div>
   </div>
  

Именно сюда следует скопировать выбранный текст переключателя

    <h6 id="rdo_text_copy">None </h6>
  

Вызов ajax для передачи значения выбранного переключателя

     $("input[type='radio]").click(function(){
        var rdo_option = $("input[name='radio_selection']:checked").val(),
            rdo_option_name = $("input[name='radio_selection']:checked").text();
        if(rdo_option){
            sel_option=rdo_option;
            $("#rdo_text_copy").text(rdo_option_name);
        }
    });

    $("#btnSelect").click(function(){
        ...
        $.ajax({
            ...
            data: {
                ...
                sel_option_value: sel_option,

            },
            success: function(response){
                ...
            }
        });
    });

  

Я попытался поместить следующий код вверху, но извлекается только значение первого переключателя.
Без этой строки вверху событие click не работает.

    sel_technique = $("input[name='feature_selection']:checked").val();
  

Ответ №1:

Во-первых, вы упомянули, что пытаетесь использовать код, который ссылается feature_selection , но которого не существует в вашем HTML.

Вместо того, чтобы возиться с text радиоприемником, вы можете использовать next для получения метки после radio , поскольку это шаблон вашего HTML.

 $("input[name='radio_selection']").change(function(){
    $("#rdo_text_copy").text($("input[name='radio_selection']:checked").next("label").text());
});