Получение соответствующего значения текстового поля выбранной радиокнопки

Я использую bootstrap, чтобы получить соответствующее текстовое значение из текстового поля выбранного переключателя.

Результат будет примерно таким:

function selectedRadioButton()
{ 
  console.info($('input[name=radiobutton]:checked', '#myForm').val());
}

<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class = "form-group" id = "myForm">
    <div class = "input-group col-sm-3">
            <div class = "input-group-prepend">
              <div class = "input-group-text">
              <input type = "radio" name = "radiobutton" aria-label = "Radio button for following text input">
              </div>
            </div>
            <input type = "text" name = "txtbox" class = "form-control" aria-label = "Text input with radio button">
    </div>
    </br>
    <div class = "input-group col-sm-3">
            <div class = "input-group-prepend">
              <div class = "input-group-text">
              <input type = "radio" name = "radiobutton" aria-label = "Radio button for following text input">
              </div>
            </div>
            <input type = "text" name = "txtbox" class = "form-control" aria-label = "Text input with radio button">
    </div>

</div>

<button type = "button" class = "btn btn-primary" onclick = "selectedRadioButton();">Download</button>

Как мне связать переключатель со значением текстового поля?

html twitter-bootstrap radio-button bootstrap-4 textfield

09.08.2018 12:20

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Введение в CSS

CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.

Как выровнять Div по центру?

Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...

Навигация по приложениям React: Исчерпывающее руководство по React Router

React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

Toor - Ангулярный шаблон для бронирования путешествий

Toor - Travel Booking Angular Template один из лучших Travel & Tour booking template in the world. 30+ валидированных HTML5 страниц, которые помогут...

442

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Используйте приведенный ниже фрагмент, чтобы получить значение элемента с помощью jquery.

function selectedRadioButton() {
  console.info($($('input[name=radiobutton]:checked').closest('.input-group').find("input[type=text]")).val());
}

<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href = "https://stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css" rel = "stylesheet" />

<div class = "form-group" id = "myForm">
  <div class = "input-group col-sm-3">
    <div class = "input-group-prepend">
      <div class = "input-group-text">
        <input type = "radio" name = "radiobutton" aria-label = "Radio button for following text input">
      </div>
    </div>
    <input type = "text" name = "txtbox" class = "form-control" aria-label = "Text input with radio button">
  </div>
  </br>
  <div class = "input-group col-sm-3">
    <div class = "input-group-prepend">
      <div class = "input-group-text">
        <input type = "radio" name = "radiobutton" aria-label = "Radio button for following text input">
      </div>
    </div>
    <input type = "text" name = "txtbox" class = "form-control" aria-label = "Text input with radio button">
  </div>

</div>

<button type = "button" class = "btn btn-primary" onclick = "selectedRadioButton();">Download</button>

Привет, я получаю значение undefined.

— 09.08.2018 13:49

Обновил вышеуказанный пост. Была какая-то опечатка.

— 09.08.2018 13:52

Ах. Прохладный. Работал как шарм! Спасибо!

— 09.08.2018 13:56

09.08.2018 13:30