2014-11-22 1 views
0

Я пытаюсь реализовать плагин Tabselect (http://fredibach.ch/jquery-plugins/tabselect.php) в моей веб-форме, я пытаюсь сделать две вещи, но не могу понять, как это сделать.как захватить выбранные вкладки в плагин TabSelect jQuery

1) когда у нас есть много значений в закладке, мне нравится добавлять строки и отображать остальные вкладки в следующей строке. 2) Захват выбранных вкладок при отправке формы. (Не уверен, где упомянуть имя/идентификатор тега и захватить те же)

ответ

1

http://jsfiddle.net/yun97ecf/1/

1), когда у нас есть много значений в закладке, я люблю для добавления строки и отображения остальных вкладок в следующей строке.

изменение контейнера из SPAN в DIV

<div class="demo"> 
    <div id="langtabs"></div> 
</div> 

в CSS: добавить ширину стиль для контейнера. например 200px

#langtabs{width:200px}/* new */ 

и добавить стиль для div.demo пролете

display: inline-block;/* new */ 

2) Захват выбранных вкладок при отправке формы. (не уверен, где упомянуть имя/идентификатор тега и захват то же самое)

В форме добавить поле ввода.

<form id="form_lang"> 

    <input type="text" name="input_select_lang" id="input_select_lang" /> 
    <input type="submit" /> 

</form> 

Привязать обработчик событий к «submit». submit function

$('#form_lang').submit(function(){ 

     var select_lang=''; 

     // ## finding all selected tabs. (span with class active) 
     $('#langtabs span.active').each(function(){ 
      var lang=$(this).text(); 
      // ## put all selected tabs in variable 
      select_lang+=','+lang; 
     }) 
     //## removing first comma 
     select_lang=select_lang.substr(1); 

     //## set input field before submit 
     $('#input_select_lang').val(select_lang);   
}) 
Смежные вопросы