JQueryからデータを取得する方法選択可能？

Question

私はSymfony2 Frameworkを使用しています。これは私がしたいことです：

入力タイプの値を変更したいのですが、選択可能なもので値を変更したいとします。

jquery.comの例では、選択したフィールドがありますが、フォームデータとしてコントローラに送信できるように、フィールドを隠しておく必要があります。

私はJQueryドキュメントの例を読みましたが、問題を変更しています。

$(function() { 
    $("#selectable").selectable({ 
     stop: function() { 
      var result = $("#select-result").empty(); 
     $(".ui-selected", this).each(function() { 
      var index = $("#selectable li").index(this); 
      result.append(" #" + (index + 1));   
      }); 
     } 

    }); 
}); 

とI Iは、入力フィールドの値を変更したい

<input name="horario" type="hidden" value=" " /> 

この隠しフィールドを持っている、例えば、のようなもの：あなたは

#1 #2 #3 #4 #5 #6 #7 #8 #9 #10 #16 #17 #18 #19 #20 #21 #22 #23. 

Answer 1

を

選択しました

このようなもの：jsFiddle例。これにより、非表示のフィールド値が選択したアイテムに設定され、デモ目的でアラートに表示されます。

jQueryの

$("#selectable").selectable({ 
    stop: function() { 
     var items = ''; 
     var result = $("#select-result").empty(); 
     $(".ui-selected", this).each(function() { 
      var index = $("#selectable li").index(this); 
      items += (" #" + (index + 1)); 
     }); 
     alert('You have selected: ' + items); 
     $('input[name="horario"]').val(items); 
    } 
});​ 

HTML

<input name="horario" type="hidden" value=" " /> 
<ol id="selectable"> 
    <li class="ui-widget-content">Item 1</li> 
    <li class="ui-widget-content">Item 2</li> 
    <li class="ui-widget-content">Item 3</li> 
    <li class="ui-widget-content">Item 4</li> 
    <li class="ui-widget-content">Item 5</li> 
    <li class="ui-widget-content">Item 6</li> 
    <li class="ui-widget-content">Item 7</li> 
</ol> 

Answer 2

それは簡単です。 javascriptを使用してリストデータを取得することができます。

$(function() { 
    $("#selectable").selectable({ 
    stop: function() { 
     var result = $("#select-result").empty(); 
    $(".ui-selected", this).each(function() { 
     var value = this.innerHTML; 
     result.append(value+" , ");   
     }); 
    } 

}); 

}）。