如何从JQuery Selectable中获取数据？

Question

我正在使用Symfony2框架，这是我想要做的：

我想要更改输入类型的值，但我希望该值是我刚刚使用可选类型选择的值。

在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 ) );          
            });
         }

    });
});

我有一个隐藏的字段

<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

如下所示：示例。这会将隐藏字段值设置为您选择的项，并且出于演示目的，将它们显示在警告中。

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+" , ");          
        });
     }

});

})；