Question

我正在使用名为“tagit”的jQuery插件。

我知道你不能发布UL，但我怎么能解决这个问题呢？

让我们说：

<ul name="addtags" id="addtags" class="addtags" placeholder="Tags">
     <li>Add your tags here</li>
</ul>

<input type="hidden" name="addtagsReal" />

提交表单时，我使用javascript进行验证。所以我在想，在我的验证中，我可以简单地将隐藏的'addtagsReal'输入设置为ul的输入。

如何使用jQuery执行此操作？

谢谢！

Answer 1

你基本上需要一种方法来“序列化”列表，这是一个较旧的jquery插件：

jQuery serialize list

Answer 2

您可以这样做：

var separator = ",";
var str = $('#addtags').children('li').map(function(i,el){
   return($(el).text()); 
}).get().join(separator);


$('input[name="addtagsReal"]').val(str);

然后你发送你的LI由'分隔符'分隔，并用PHP爆炸它们。

Answer 3

你可以用简单的连接和一些jQuery tomfoolery来制作逗号分隔的'data'字符串。肯定有更好的方法来做到这一点。

$(document).ready(function(){
    var sampleTags = ['c++', 'java', 'php'],
        eventTags = $('#eventTags');

    eventTags.tagit({
        availableTags: sampleTags,
        afterTagAdded: function(evt, ui) {
            updateTagInput();
        },
        afterTagRemoved: function(evt, ui) {
            updateTagInput();
        }

    });
});

function updateTagInput() {
    var $hidden = $('input[name=addtagsReal]'), 
        values = "";

    $('#eventTags').find('.tagit-label').each(function(i, item){
        values += $(item).text() + ', ';
    });

       // update the input and trim the final ', ' 
   $hidden.val(values.substr(0, values.length - 2 ));
}

修改：哎呀！删除了插件，以为我正在删除它的版本！抱歉，不会重新创建它，但它使用了此页面的事件部分中的html http://aehlke.github.io/tag-it/examples.html

将表单值设置为UL的表单值

3 个答案: