Javascript-форум - как при клике на <li> поставить значение в <select>?

Javascript-форум (https://javascript.ru/forum/)

- Элементы интерфейса (https://javascript.ru/forum/dom-window/)

- - как при клике на <li> поставить значение в <select>? (https://javascript.ru/forum/dom-window/50835-kak-pri-klike-na-li-postavit-znachenie-v-select.html)

как при клике на <li> поставить значение в <select>?

Привет!

Я не монстр jQuery, помогите!

Как в скрытый <select> поставить значение при клике на <li>

http://test2.stdmed.ru/events.html - тут еще не скрытый <select> чтобы было видно что значение меняется.

Цитата:

Сообщение от ViRuSreloaded

помогите

Ты хоть бы тестовый пример челе сделал...

Хорошо, перефразирую: помогите чайнику :)
При клике на месяц надо чтобы на месте MONTH написался выбранный месяц, а для бэк-енда в скрытом селекте подставилось значение. На основании предложенного решения сделаю все селекты на сайте.

ViRuSreloaded,
а одинаковые id это нормально?

Наверное нет. Когда будет решение на мой вопрос надо будет конечно же переименовать.

Вопрос еще ни в коем разе не решен! (это я так, на всякий случай! А то никто ничего не предлагает. Это сложно чтоли? ПОмогите...

ViRuSreloaded,
а вам сложно было сделать тестовый пример ... локализовать проблему в вашем венигрете из одинаковых id и кучи разных li кроме нужных ... код ниже если бы вы его предоставили ... помог бы вам получить ответ очень быстро ...

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <link rel="stylesheet" type="text/css" href="http://test2.stdmed.ru/styles.css">
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
     $(function(){
       var $li = $('li'), $sel = $('.selectBox');
	   $li.click(function(event) {
	     event.preventDefault();
	     var text = $(this).text();
             $('.select_name').text(text);
	     var val = $('[data-html-text="'+text+'"]', $sel).val();
         $sel.val(val);
      });
});
  </script>
</head>

<body>
<div id='lil_navi_select' class='month'>
<select name="month_select" class="selectBox">
	<option value="0" selected="selected" data-skip="1">Month</option>
    <option value="1" data-html-text="JANUARY">JANUARY</option>
    <option value="2" data-html-text="FEBRUARY">FEBRUARY</option>
    <option value="3" data-html-text="MARCH">MARCH</option>
    <option value="4" data-html-text="APRIL">APRIL</option>
    <option value="5" data-html-text="MAY">MAY</option>
</select>
			<div class='output_all'><span class='select_name'>MONTH</span><img src='http://test2.stdmed.ru/images/arrow_down_black.png'></div>
				<div id='all'>
					<div class='list_all'>
						<ul>
							<li><a href='#'>JANUARY</a></li>
							<li><a href='#'>FEBRUARY</a></li>
							<li><a href='#'>MARCH</a></li>
							<li><a href='#'>APRIL</a></li>
							<li><a href='#'>MAY</a></li>
						</ul>
					</div>
				</div>
			</div>
</body>
</html>

Мил человек! спасибо тебе огромное! и не поленился же столько кода написать! Горячо обнимаю!

А как бы сделать теперь чтобы вот сюда: <span class='select_name'>MONTH</span> подставлялось выбранное значение? т.к. сам селект я скрою от глаз. ?

ViRuSreloaded,
учите доки ... строка 16 добавлено

Спасибо огромное еще раз! А по поводу доков - знать бы где? Не умею я пока находить в документации ответы потому что не знаю как искать. Если есть какой-то простой способ научиться - с удовольствием выслушаю.

Мы с другом купили книгу в PDF если кому надо - пишите кину!

Верните, оно бесплатно скачивается http://www.ecmascript.org/docs.php

Насчет календарей на морде и спины на конце. Это какой-то чудовищный тренд пихать кошмарные календари вместо обычных полей. Ну то есть требовать от юзера вводить форматированную дату, а, поскольку он не бельмеса - оказывать помощь выкатывая календарь. Чистый пиар: сначал юзер очумел, потом обрадовался и давай баттоны давить.

А что, вот так нельзя позволить написать 22 июня 1941 года?

По-английски все понимает вот эта функция - http://php.net/manual/en/function.strtotime.php - надо только на русский переделать.

У меня документация по Яве то на русском :)
И кстати мне надо календарь сейчас сделать чтобы он был "живой", а именно:
а) чтобы выделялось текущее число и активный месяц
б) чтобы при переключении месяцев менялись дни в календарике
Вот думаю как же я "попал" :)

Как бы стыдно не было выкладываю код:

<div id='nav_left' class="goLeft"><a href='#'><img src='images/arrow_left_cal.png'></a></div>
	<div id='full_month'>
	<div id="calendar_events_content">
		<div id='day' class='full'>
			<a href='#'>
				<div id='day_content'>
					<div id='week_day'>SU</div>
					<div id='month_day'>1</div>
				</div>
			</a>
		</div>
		<div id='day' class='selected'>
			<a href='#'>
				<div id='day_content'>
					<div id='week_day'>MO</div>
					<div id='month_day'>2</div>
				</div>
			</a>
		</div>
		<div id='day' class='empty'>
				<div id='day_content'>
					<div id='week_day'>TU</div>
					<div id='month_day'>3</div>
				</div>
		</div>
		<div id='day' class='empty'>
				<div id='day_content'>
					<div id='week_day'>WE</div>
					<div id='month_day'>4</div>
				</div>
		</div>
		<div id='day' class='full'>
			<a href='#'>
				<div id='day_content'>
					<div id='week_day'>TH</div>
					<div id='month_day'>5</div>
				</div>
			</a>
		</div>
		<div id='day' class='full'>
			<a href='#'>
				<div id='day_content'>
					<div id='week_day'>FR</div>
					<div id='month_day'>6</div>
				</div>
			</a>
		</div>
		<div id='day' class='full'>
			<a href='#'>
				<div id='day_content'>
					<div id='week_day'>SA</div>
					<div id='month_day'>7</div>
				</div>
			</a>
		</div>
		<div id='day' class='full'>
			<a href='#'>
				<div id='day_content'>
					<div id='week_day'>SU</div>
					<div id='month_day'>8</div>
				</div>
			</a>
		</div>
		<div id='day' class='empty'>
				<div id='day_content'>
					<div id='week_day'>MO</div>
					<div id='month_day'>9</div>
				</div>
		</div>
		<div id='day' class='empty'>
				<div id='day_content'>
					<div id='week_day'>TU</div>
					<div id='month_day'>10</div>
				</div>
		</div>
		<div id='day' class='empty'>
				<div id='day_content'>
					<div id='week_day'>WE</div>
					<div id='month_day'>11</div>
				</div>
		</div>
		<div id='day' class='full'>
			<a href='#'>
				<div id='day_content'>
					<div id='week_day'>TH</div>
					<div id='month_day'>12</div>
				</div>
			</a>
		</div>
		<div id='day' class='full'>
			<a href='#'>
				<div id='day_content'>
					<div id='week_day'>FR</div>
					<div id='month_day'>13</div>
				</div>
			</a>
		</div>
		<div id='day' class='full'>
			<a href='#'>
				<div id='day_content'>
					<div id='week_day'>SA</div>
					<div id='month_day'>14</div>
				</div>
			</a>
		</div>
		<div id='day' class='full'>
			<a href='#'>
				<div id='day_content'>
					<div id='week_day'>SU</div>
					<div id='month_day'>15</div>
				</div>
			</a>
		</div>
		<div id='day' class='empty'>
				<div id='day_content'>
					<div id='week_day'>MO</div>
					<div id='month_day'>16</div>
				</div>
		</div>
		<div id='day' class='empty'>
				<div id='day_content'>
					<div id='week_day'>TU</div>
					<div id='month_day'>17</div>
				</div>
		</div>
		<div id='day' class='empty'>
				<div id='day_content'>
					<div id='week_day'>WE</div>
					<div id='month_day'>18</div>
				</div>
		</div>
		<div id='day' class='full'>
			<a href='#'>
				<div id='day_content'>
					<div id='week_day'>TH</div>
					<div id='month_day'>19</div>
				</div>
			</a>
		</div>
		<div id='day' class='full'>
			<a href='#'>
				<div id='day_content'>
					<div id='week_day'>FR</div>
					<div id='month_day'>20</div>
				</div>
			</a>
		</div>
		<div id='day' class='full'>
			<a href='#'>
				<div id='day_content'>
					<div id='week_day'>SA</div>
					<div id='month_day'>21</div>
				</div>
			</a>
		</div>
		<div id='day' class='full'>
			<a href='#'>
				<div id='day_content'>
					<div id='week_day'>SU</div>
					<div id='month_day'>22</div>
				</div>
			</a>
		</div>
		<div id='day' class='empty'>
				<div id='day_content'>
					<div id='week_day'>MO</div>
					<div id='month_day'>23</div>
				</div>
		</div>
		<div id='day' class='empty'>
				<div id='day_content'>
					<div id='week_day'>TU</div>
					<div id='month_day'>24</div>
				</div>
		</div>
		<div id='day' class='empty'>
				<div id='day_content'>
					<div id='week_day'>WE</div>
					<div id='month_day'>25</div>
				</div>
		</div>
		<div id='day' class='full'>
			<a href='#'>
				<div id='day_content'>
					<div id='week_day'>TH</div>
					<div id='month_day'>26</div>
				</div>
			</a>
		</div>
		<div id='day' class='full'>
			<a href='#'>
				<div id='day_content'>
					<div id='week_day'>FR</div>
					<div id='month_day'>27</div>
				</div>
			</a>
		</div>
		<div id='day' class='full'>
			<a href='#'>
				<div id='day_content'>
					<div id='week_day'>SA</div>
					<div id='month_day'>28</div>
				</div>
			</a>
		</div>
		<div id='day' class='full'>
			<a href='#'>
				<div id='day_content'>
					<div id='week_day'>SU</div>
					<div id='month_day'>29</div>
				</div>
			</a>
		</div>
		<div id='day' class='empty'>
				<div id='day_content'>
					<div id='week_day'>MO</div>
					<div id='month_day'>30</div>
				</div>
		</div>
		<div id='day' class='empty'>
				<div id='day_content'>
					<div id='week_day'>TU</div>
					<div id='month_day'>31</div>
				</div>
		</div>
    </div>
	</div>
	<div id='nav_right' class='goRight'><a href='#'><img src='images/arrow_right_cal.png'></a></div>
<div id='width20'></div>

намек понял :)

Кстати, кто-то просил книгу со словами "хочу" - нигде немогу найти его ник - отпишитесь я вышлю!

Datepicker - это не совсем то,что надо. Надо считать текущую дату и вывести относительно ее текущий месяц, дату, дни в календаре...

Цитата:

Сообщение от ViRuSreloaded

Надо считать текущую дату и вывести относительно ее текущий месяц, дату, дни в календаре...

это всё уже есть в Datepicker, разве по ссылке не текущая в календарике и прочее

Может еще одним палачом мозга станет меньше. Потыкается, не найдет нужных фич и сделает текстовое поле.

я сегодня заново переоценил свои возможности Frontender-a мне надо еще учиться и учиться, вникать в код, начинать с азов про типы переменных и прочее, синтаксис, а не клянчить помощи на форуме. Всем спасибо тем не менее! Приятно что не так одинок наедине со своими проблемами...

Выбор элемнта списка <li> по клику. Виджет autocomplete().

:help: Не могу настроить, чтобы по клику на каком-то элементе списка значение этого элемента записывалось в текстовое поле input (строки 25-35). Или, может быть, кто нибудь знает, как вместо всего этого скрипта настроить виджет JQuery autocomplete() с параметрами кроссдоменного запроса из из строки 13-15. Буду очень признателен за помощь.

<input id="myElement" type="text" size="40" />
   <div id="autocomlet">
<ul id="list"></ul>
</div>

<script type="text/javascript">
  var xhr = new easyXDM.Rpc({
            swf: "https://discovery.gdbilet.ru/cors/easyxdm.swf",
            remote: "https://discovery.gdbilet.ru/cors/index.html"
         }, {
            remote: {
               request: {}
            }
        });
 document.getElementById('myElement').onkeypress = function menu () {  
            var s = document.getElementById('myElement').value; 
            xhr.request({                                                            
            url: "https://discovery.gdbilet.ru/Rzhd/Train/SearchStation",
            method: "GET",
            data: { limit: 10, q: s }
         }, function(response) {  
var arr = JSON.parse(response.data); 
 var list = document.getElementById('list'); 
while (list.firstChild) {list.removeChild(list.firstChild)};
for (var i = 0; i < arr.length; i++)  {var li = document.createElement('li');
li.innerHTML = arr[i].name;
list.appendChild(li); li.id = 'auto'; }; 
         });
};
 document.getElementById('auto').onclick  =  function entervalue (){
var m, k;
m=document.getElementById("list").getElementsByTagName("li");
k=m.length;
while(k--){m[k].onclick=myLI;};
 };
 
function myLI(){
document.getElementById('myElement')=this.innerHTML;
};
</script>

aj-nik,
value потеряли в 33 строке ... да и лишнее это 25 - 30
http://learn.javascript.ru/play/CumCz

Очень круто, спасибо.