Переключатель Jquery с онкликом

Question

У меня есть radio_button_tag следующим образом:

 <%= radio_button_tag "content[id]", content.id%><%= content.title %>

и иметь текстовое поле следующим образом:

<%= f.text_field :title %>

Когда я нажимаю переключатель, название переключателя должно появиться в поле text_ выше. Я пытаюсь использовать для этого jQuery.

Answer 1

Во-первых, давайте добавим атрибут заголовка к вашим переключателям:

<%= radio_button_tag "content[id]", content.id, {}, {:title => content.title} %><%= content.title %>

Выше следует вывести некоторый HTML, который выглядит следующим образом:

<input id="content_id_<content.id>" type="radio" value="<content.id>" title="<content.title>" name="content[id]" />

Во-вторых, вот код jQuery:

jQuery(function(){
    // For each radio button whose name is 'content[id]':
    jQuery("input[type='radio'][name='content[id]']").each(function(index, button){
        // Give the button a certain click behaviour:
        jQuery(button).click(function(){
            // Set the value of 'title' textfield to the radio's title
            jQuery("#title").val(this.title);
        });
    });
});

Эта анонимная функция будет выполнена, когда документ будет загружен. Он привязывает поведение кнопок к вашим кнопкам, поэтому вам не нужен атрибут onclick.

(Это добавит только поведение щелчка к самой радиокнопке. Если вы хотите добавить элемент <label> к каждой радиокнопке и дать ему такое же поведение, вам придется добавить немного к вышеупомянутому коду jQuery .)

Answer 2

Принимая html как

 <form>
<input type="radio" id="sex" name="sex" value="male" /> Male<br />
<input type="radio" id="sex" name="sex" value="female" /> Female

    <input type="text" name="des" id="des" />
</form>

Javascript будет

$("#des").val($("#sex").val());
$("#sex").change(function(){
    alert($("#sex").val());     
   $("#des").val($("#sex").val());
});
Demo

http://jsfiddle.net/Wr8dJ/23/

Answer 3

Не уверен насчет ruby, но в .net я бы поставил имя класса на радио, метку и текстовое поле. тогда я могу использовать это;

$(document).ready(function(){

  $(".radioClassName").click(function(){

    $(".TextBoxClassName").val($(".radioLabelClassName").text());

  });

});

Ваш HTML может выглядеть так:

<input type=radio class="radioClassName"><label class="radioLabelClassName">my text"</label>

<input type="text" class="TextBoxClassName">

Не уверен, что это будет работать, но я думаю, jQuery - это jQuery