Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   копирование значения селект в поле инпут (https://javascript.ru/forum/jquery/62937-kopirovanie-znacheniya-selekt-v-pole-input.html)

d138p 08.05.2016 09:29

копирование значения селект в поле инпут
 
может кто сможет поомчь, ситуация такая : есть форма с динамическими полями, нужно значения выбранного селекта перенести в поле инпут. вот код но он работает только при : 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 08.05.2016 10:04

Цитата:

Сообщение от d138p
но данный метод не подходит для динамических полей

С чего вдруг?

d138p 08.05.2016 10:11

laimas,
я особо не силен в этом, может скажете как можно сделать чтоб он работал? а то уже несколько дней мучаюсь

laimas 08.05.2016 10:20

Цитата:

Сообщение от d138p
может скажете как можно сделать чтоб он работал

А как сделать, так нужно видеть чего нужно сделать. К примеру selects.each... значит списки добавляется в форму, а как, где код? Форма уже имеется на странице, она сама не добавляемая динамически?
Да и вообще, что в итоге и как будет передано на сервер - сама форма и непосредственно или асинхронная отправка только выбранных полей? Это к тому, что в первом случае переносить данные из одних полей в другие не имеет смысла.

Показывайте код, разъясняйте, тогда и ответ адекватный будет.

d138p 08.05.2016 10:27

<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("'", "&apos;", $l->name).'</option>';
				}
				$cat_sel .= '</select>';	
				echo "cats[$parent_id]='$cat_sel<div id=\"after_cat_$parent_id\"></div>';";
				
				?>


-----------------это я так понимаю и есть селект который динамический

d138p 08.05.2016 10:29

$('body').on('click', "option", function(){
     
	   var 
	   values = $(this).text();
	 alert('Вы нажали на элемент с текстом - «' + values + '»');

решил проверить вот так, я смог получить значение поля динамического. вот как его правильно передать в инпут, для меня загадка

laimas 08.05.2016 10:34

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

d138p 08.05.2016 10:43

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

laimas 08.05.2016 11:03

Если только осваиваем, то жмем 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\'., которые сервер и будет обрабатывать получая форму, то есть передавать при этом тексты выбранных опций это и мусор, и глупо. Текст их сервер и без клиента знает, а для информации клиента что он выбрал служат сами списки. Если охота "приукрасить" это или списков много, то тексты можно помещать не в поле ввода, а любой html элемент.

d138p 08.05.2016 11:14

laimas,
спасибо. сейчас осталось разобраться как передать значения массива в поле инпут


Часовой пояс GMT +3, время: 20:42.