копирование значения селект в поле инпут
может кто сможет поомчь, ситуация такая : есть форма с динамическими полями, нужно значения выбранного селекта перенести в поле инпут. вот код но он работает только при : selects.change(function () - но данный метод не подходит для динамических полей.....
пробую так, но он не работает((((: var selects = $('.forname'), title= $('#adres'); $('body').on('click', "option", function(){ { var values = []; selects.each(function () { values.push($(this).find(':selected').text()); }); title.val(values.join(' ')); }); .forname - класс селектов с которым работаю. #adres - id инпут поля куда должны выводиться значения. |
Цитата:
|
laimas,
я особо не силен в этом, может скажете как можно сделать чтоб он работал? а то уже несколько дней мучаюсь |
Цитата:
Да и вообще, что в итоге и как будет передано на сервер - сама форма и непосредственно или асинхронная отправка только выбранных полей? Это к тому, что в первом случае переносить данные из одних полей в другие не имеет смысла. Показывайте код, разъясняйте, тогда и ответ адекватный будет. |
<div class="djform_field"> <?php $title_char_limit = $par->get('title_char_limit','0'); if($title_char_limit>0){ $input_title_limit =' onkeyup="titleLimit('.$title_char_limit.');" '; }else{ $input_title_limit =''; } ?> <input name="adres" type="text" spellcheck="true" class="pole" id="adres" maxlength="250" value="" /> </div> ---------- инпут куда должно попоадать значение селект---------- <div id="after_cat_0"></div> <script type="text/javascript"> var cats=new Array(); <?php $cat_sel = '<select style="width:210px" class="forname" name="cats[]" id="cat_0" onchange="new_cat(0,this.value);getFields(this.value);">'; $parent_id=0; $cat_req = array(); foreach($this->cats as $l){ if($l->ads_disabled){ $cat_req[$l->id]=1; } } foreach($this->cats as $l){ if($parent_id!=$l->parent_id){ $cat_sel .= '</select>'; echo "cats[$parent_id]='$cat_sel<div id=\"after_cat_$parent_id\"></div>';"; $parent_id=$l->parent_id; $cl_select = ''; if($l->ads_disabled || isset($cat_req[$parent_id])){ $cl_select = ' class="forname" '; } $cat_sel = '<div style="clear:both"></div><select '.$cl_select.' style="width:210px" name="cats[]" id="cat_'.$l->parent_id.'" onchange="new_cat('.$parent_id.',this.value);getFields(this.value);">'; $cat_sel .= '<option value="p'.$parent_id.'">'.JTEXT::_('COM_DJCLASSIFIEDS_CATEGORY_SELECTOR_EMPTY_VALUE').'</option>'; } if($l->price>0){ $l->price = $l->price/100; $l->name .= ' ('.DJClassifiedsTheme::priceFormat($l->price,$unit_price); if($l->points>0 && $points_a){ $l->name .= ' - '.$l->points.JTEXT::_('COM_DJCLASSIFIEDS_POINTS_SHORT'); } $l->name .= ')'; } $cat_sel .= '<option value="'.$l->id.'">'.str_ireplace("'", "'", $l->name).'</option>'; } $cat_sel .= '</select>'; echo "cats[$parent_id]='$cat_sel<div id=\"after_cat_$parent_id\"></div>';"; ?> -----------------это я так понимаю и есть селект который динамический |
$('body').on('click', "option", function(){ var values = $(this).text(); alert('Вы нажали на элемент с текстом - «' + values + '»'); решил проверить вот так, я смог получить значение поля динамического. вот как его правильно передать в инпут, для меня загадка |
Вы показываете РНР код формирующий список, то есть то, что увидит пользователь запросив страницу. Все, сервер отработал и ушел спать, а клиент получит статичный контент. Вопрос - с чего вы решили, что списки в форму добавляются динамически?
|
значит не динамически. я только начинаю это все осваивать, по-этому и попросил помощи. так может подскажете как правильно использовать скрипт чтоб получить желаемый результат?
|
Если только осваиваем, то жмем F12 и в отладчике смотрим исходный html-код страницы. Если форма ваша и ее списки на ней, то нет никакой динамики их добавления. Следовательно достаточно будет при загрузке документа установить обработчик (и) необходимые.
$(function() { $('.forname').on('change', "select", function() { var a = $.map($('.forname').find('option:selected'), function(i) { return i.text }) //а - массив содержащий значения выбранных опций }); }); В данном случае обработка изменений списков делегируется форме, что работало бы и в случае если бы форма была на странице, а списки динамически добавлялись. Но можно было написать и $('select').change(function ..., если списки уже на странице. Примечание: метод $.map нужен, если списков действительно несколько, что по коду явно так. Но, каждая опция списка имеет значение идентификатора - p'.$parent_id, которые сервер и будет обрабатывать получая форму, то есть передавать при этом тексты выбранных опций это и мусор, и глупо. Текст их сервер и без клиента знает, а для информации клиента что он выбрал служат сами списки. Если охота "приукрасить" это или списков много, то тексты можно помещать не в поле ввода, а любой html элемент. |
laimas,
спасибо. сейчас осталось разобраться как передать значения массива в поле инпут |
Цитата:
|
laimas,
что-то вообще не получается вывести текст в инпут.... не поможете еще разок? |
Вы не ответили для чего это нужно, ибо либо это полная хрень, либо если нужны тексты, а не идентификаторы, то почему они не в опциях в качестве значений?
А поместить это можно так, сразу, и коли это адрес, значит через запятую: $(function() { var o = $('.forname').on('change', "select", function() { $('#adres').val(o.find('option:selected'), function(i) { return i.text }).join(', ')) }); }); И адрес на английском, это address ) |
смыс в том, что это будет использоваться в поле добавления объявлений. т.е чтоб заголовок так скажем генерировался автоматически по названиям категорий. http://автокоми.рф/index.php/novoe-ob-yavlenie можете посмотреть.
|
laimas,
поместил. все равно не работает((( |
Это не повод впихивать в поле ввода тексты выбранных опций. Для формирования чего угодно, а не только заголовков, списком как раз и передается уникальный идентификатор как владелец этого текста. А сервер принимая данные от клиента, и тем более если его выбор подлежит записи в базу, просто обязан проверить данные пришедшие. А проверить на 100%, что вам не фуфло подсунули или еще чего страшнее, как раз по идентификаторам, а не по тексту который впихули в какое то поле формы.
Зная выбор пользователя, то есть значения тех же списков, серверу в любое время раз плюнуть получить их тексты и сформировать заголовки и все что угодно. Для этого и существуют СУБД, а не для "городить огород". |
эх знать бы еще как это сделать
|
Ошибку при правке допустил, заменить строки 3 - 5 на
$('#adres').val($.map(o.find('option:selected'), function(i) { return i.text }).join(', ')) |
Цитата:
|
я замучал уже наверное.... но все равно не работает
<script type="text/javascript"> $(function() { var o = $('.forname').on('change', "select", function() { $('#adres').val($.map(o.find('option:selected'), function(i) { return i.text }).join(', ')) }); }); </script> |
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> <script> $(function() { var o = $('.forname').on('change', "select", function() { $('#adres').val($.map(o.find('option:selected'), function(i) { return i.text }).join(', ')) }); }); </script> </head> <body> <form class="forname"> <select name="as[]"> <option>Text 1</option> <option>Text 2</option> </select> <select name="as[]"> <option>Sub 1</option> <option>Sub 2</option> </select> <input id="adres" /> </form> </body> </html> Работает? |
тут работает. у меня нет. возможно потому что у меня селекты лежат в диве, а у вас форм.
|
DIV тут не причем. А вот с селекторами, у вас в примере обращение к форме по имени класса forname, а по ссылке такого нет, есть id, если ссылка это ваша страница. Кроме того, по ссылке выбор в списке, это асинхронные запросы к серверу, которые завершаются ошибкой.
В общем надо с кодом реальным разбираться. |
ну это был готовый компонент для джумлы dj classfieds сам я там ничего не правил....
|
спасибо огромное за помощь. буду думать разбираться. изучать.
|
Часовой пояс GMT +3, время: 17:08. |