Отправляет email-рассылки с помощью сервиса Sendsay

Секреты программирования

  Все выпуски  

Секреты программирования - добавление 'меток' (JavaScript)


Уважаемые подписчики!

Сегодняшняя тема - добавление "меток".
Недавно возникла необходимости "нагружать метками" записи базы данных. Из списка можно выбрать несколько значений, которые и будут метками текущей записи. Написал небольшую программку. Код показался интересным, решил обсудить.
Переход к примеру.

Код


<script>
var lab_valid = 0;
function addLab()
{
 var obj = document.getElementById("label_names");
 var s = obj.innerHTML;
 var sLab = form1.fi_label.options[ form1.fi_label.selectedIndex ].text + " ";
 if( s.indexOf( sLab ) < 0 )
 {
  if( lab_valid >= 10 )
  {
   alert( "10 max" );
   return false;
  }
  lab_valid ++;
  obj.innerHTML = s + sLab;
  form1.keywords.value += ( form1.fi_label.options[ form1.fi_label.selectedIndex ].value + ";" );
 }
 return false;
}
function delLab()
{
 var obj = document.getElementById("label_names");
 var s = obj.innerHTML;
 var sLab = form1.fi_label.options[ form1.fi_label.selectedIndex ].text + " ";
 var pos = s.indexOf( sLab );
 if( pos >= 0 )
 {
  lab_valid --;
  var t = s.substr( 0, pos ) + s.substr( pos + sLab.length );
  obj.innerHTML = t;
  
  s = form1.keywords.value;
  sLab = ";" + form1.fi_label.options[ form1.fi_label.selectedIndex ].value + ";"
  pos = s.indexOf( sLab );
  if( pos >= 0 )
  {
   t = s.substr( 0, pos ) + ";" + s.substr( pos + sLab.length );
   form1.keywords.value = t;
  }
 }
 return false;
}
</script>
<form method="post" action="xxx.asp" id="form1" name="form1" onsubmit="alert( form1.keywords.value ); return false"> 
<input type="hidden" name="keywords" value=";55;38;">
<table>
 <tr> 
  <td width="20" align="center"> </td>
  <td width="200" align="left"><b>Метки:</b></td>
  <td>
   <span id="label_names" style=""width:400px;" height:100px; border-color:#000000; border-style:solid; border-width:1px;">интернет блоги </span>
<span style=""width:150px;" height:100px">
<select name="fi_label" style=""width:150px">"
<option value='53'>авто</option>
<option value='36'>автоваз</option>
<option value='38'>блоги</option>
<option value='54'>война</option>
<option value='39'>госдума</option>
<option value='41'>евросоюз</option>
<option value='47'>женщины</option>
<option value='48'>животные</option>
<option value='49'>игры</option>
<option value='55'>интернет</option>
<option value='42'>космос</option>
<option value='40'>криминал</option>
<option value='35'>путин</option>
<option value='50'>работа</option>
<option value='37'>россия</option>
<option value='43'>секс</option>
<option value='45'>сша</option>
<option value='44'>туризм</option>
<option value='52'>церковь</option>
<option value='46'>экология</option>
<option value='51'>юбилей</option>
</select>
<input type="button" value="Добавить" style=""width:120px"" onclick="return addLab()">
<br><input type="button" value="Удалить" style=""width:120px"" onclick="return delLab()">
<br><input type="submit" value="Отправить" style=""width:120px">"
</span>
  </td>
 </tr>
<table>
</form>



Переход к примеру.

Комментарии

При добавлении метки, ее значение помещается в элемент '<span id="label_names>", а идентификатор добавляется к элементу формы "keywords". Если метки не выбраны, его значение - ";". В итоге список идентификаторов, разделенных ";" передается на сервер. При добавлении происходит пропуск уже добавленных значений.

Для улучшения "обратной связи" приглашаю обсудить рассылку на форуме сайта http://www.pvobr.ru в разделе "Программирование". Пишите также, какие темы вы хотите рассмотреть в будущем.

Успехов!
Андрей

В избранное