Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 26.03.2011, 17:42
Новичок на форуме
Отправить личное сообщение для AndreiN Посмотреть профиль Найти все сообщения от AndreiN
 
Регистрация: 26.03.2011
Сообщений: 2

передача текста в textarea в зависимости от выбора radiobutton
Здравствуйте!
Недавно столкнулся с такой задачей. -

Допустим, имеются 2 формы вида -

<form name = "SetQuery" action = "queries.php" method = "post">
        <textarea rows="6" cols="74" name="query_text"></textarea>
        <input type = "radio" name = "query" value = "query_1">Запрос 1
        <input type = "radio" name = "query" value = "query_2">Запрос 2
        <input type = "radio" name = "query" value = "query_3">Запрос 3
</form>


и

<form name = "SetQuery2" action = "queries.php" method = "post">
        <textarea rows="6" cols="74" name="query_text2"></textarea>
        <input type = "radio" name = "query" value = "query_1">Запрос 1
        <input type = "radio" name = "query" value = "query_2">Запрос 2
        <input type = "radio" name = "query" value = "query_3">Запрос 3
</form>


Подскажите, пожалуйста, как мне реализовать такое -
нажимаем на radiobutton - в первую форму подаётся какое-то слово, например, "Апельсин",
а во вторую форму подаётся слово "Яблоко". (Слова, естественно, заранее заготовлены).
Слова в обеих формах должны меняться в зависимости от выбранного пункта. (несколько radiobutton).

К сожалению, с JavaScript я практически не знаком.
В интернете попадалось мне такое решение, но только для одной формы -

<script type="text/javascript">
var TextForR = {
    'query_1' : 'Текст 1',
    'query_2' : 'Текст 2',
    'query_3' : 'Текст 3'
};
function foo(r) {
    if (r && r.value && TextForR[r.value]) document.SetQuery.query_text.value = TextForR[r.value];
};
</script>
<form name = "SetQuery" action = "queries.php" method = "post">
        <textarea rows="24" cols="80" name="query_text"></textarea>
        <input type = "radio" name = "query" value = "query_1" onclick="foo(this)">Запрос 1
        <input type = "radio" name = "query" value = "query_2" onclick="foo(this)">Запрос 2
        <input type = "radio" name = "query" value = "query_3" onclick="foo(this)">Запрос 3
</form>


Помогите, пожалуйста, справиться с задачей.
Ответить с цитированием
  #2 (permalink)  
Старый 26.03.2011, 23:16
Особый гость
Посмотреть профиль Найти все сообщения от monolithed
 
Регистрация: 02.04.2010
Сообщений: 4,260

<script type="text/javascript">
window.onload = function() {
    var forma = document.forma,
        input = forma.input, i = input.length, 
        array = ['query1', 'query2', 'query3'];
    
    while(i--) {
        input[i].onchange = function(i) {
            return function() {
                forma.text.value = array[i];
            };
        }(i);
    }     
};
</script>

<form name="forma" action="" method="post">
    <input type="radio" name="input" />Запрос 1
    <input type="radio" name="input" />Запрос 2
    <input type="radio" name="input" />Запрос 3<br />
    <textarea rows="6" cols="26" name="text" /></textarea>
</form>

или в такой нотации:
<script type="text/javascript">
window.onload = function() {
    var forma = document.forma,
        input = forma.input,i = input.length, 
        array = {
            value1 : 'query1',
            value2 : 'query2',
            value3 : 'query3'
        };
    
    while(i--) {
        input[i].onchange = function(i) {
            return function() {
                forma.text.value = array[this.value];
            };
        }(i);
    }
};
</script>

<form name="forma" action="" method="post">
    <input type="radio" name="input" value="value1" />Запрос 1
    <input type="radio" name="input" value="value2" />Запрос 2
    <input type="radio" name="input" value="value3" />Запрос 3<br />
    <textarea rows="6" cols="26" name="text"></textarea>
</form>

Последний раз редактировалось monolithed, 26.03.2011 в 23:27.
Ответить с цитированием
  #3 (permalink)  
Старый 26.03.2011, 23:50
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,118

monolithed,
Возможно TC всего лишь дубликат ...
<script type="text/javascript">
var TextForR = {
    'query_1' : 'Текст 1',
    'query_2' : 'Текст 2',
    'query_3' : 'Текст 3'
};
var TextForR2 = {
    'query_1' : 'Текст 11',
    'query_2' : 'Текст 22',
    'query_3' : 'Текст 33'
};
function foo(r) {
    if (r && r.value && TextForR[r.value]) document.SetQuery.query_text.value = TextForR[r.value];
};
function foo2(r) {
    if (r && r.value && TextForR2[r.value]) document.SetQuery2.query_text2.value = TextForR2[r.value];
};
</script>
<form name = "SetQuery" action = "queries.php" method = "post">
        <textarea  name="query_text"></textarea>
        <input type = "radio" name = "query" value = "query_1" onclick="foo(this)">Запрос 1
        <input type = "radio" name = "query" value = "query_2" onclick="foo(this)">Запрос 2
        <input type = "radio" name = "query" value = "query_3" onclick="foo(this)">Запрос 3
</form>
<form name = "SetQuery2" action = "queries.php" method = "post">
        <textarea  name="query_text2"></textarea>
        <input type = "radio" name = "query" value = "query_1" onclick="foo2(this)">Запрос 1
        <input type = "radio" name = "query" value = "query_2" onclick="foo2(this)">Запрос 2
        <input type = "radio" name = "query" value = "query_3" onclick="foo2(this)">Запрос 3
</form>

P.S. onclick надёжнее onchange ...
Ответить с цитированием
  #4 (permalink)  
Старый 02.04.2011, 16:22
Новичок на форуме
Отправить личное сообщение для AndreiN Посмотреть профиль Найти все сообщения от AndreiN
 
Регистрация: 26.03.2011
Сообщений: 2

Большое спасибо!
Ответить с цитированием
  #5 (permalink)  
Старый 07.02.2016, 23:34
Новичок на форуме
Отправить личное сообщение для Arteist Посмотреть профиль Найти все сообщения от Arteist
 
Регистрация: 07.02.2016
Сообщений: 3

А как сделать, что бы результат выводился не в текстовую область, а просто был написан?
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как сделать чтобы textarea тянулась в высоту при добавлении в нее текста? javasc Общие вопросы Javascript 4 27.03.2012 22:14
Каретка в конце текста при фокусе textarea InetBUG Events/DOM/Window 0 05.12.2010 01:54
Подсчет "реальной" длины текста в textarea modernx Элементы интерфейса 22 06.06.2010 18:30
Вставка текста в textarea после выбора select option modelisto Общие вопросы Javascript 2 14.10.2009 19:27
Открытие окна в зависимости от выбора в <option> partyzan Общие вопросы Javascript 0 10.04.2008 01:00