1

使用这个插件 https://github.com/aehlke/tag- 顺便说一句，它非常酷。

问题：

        <input type="hidden" name="tags" id="mySingleField" value="Apple, Orange" disabled="true">
        Tags:<br>
        <ul id="mytags"></ul>

<script type="text/javascript">
    $(document).ready(function () {
        $("#mytags").tagit({
            singleField: true,
            singleFieldNode: $('#mySingleField'),
            allowSpaces: true,
            minLength: 2,
            removeConfirmation: true,
            tagSource: function (request, response) {
                //console.log("1");
                $.ajax({
                    url: "../City/GetList",
                    data: { term: request.term },
                    dataType: "json",
                    success: function (data) {
                        response($.map(data, function (item) {
                            return {
                                label: item.label + " (" + item.id + ")",
                                value: item.value
                            }
                        }));
                    }
                });
            }
        });
    });



</script>

当标记它选择值时，它会将值添加到值 attr 中 CSV 格式的隐藏字段中。我想让它做ID而不是有人知道怎么做吗？

4

2 回答 2

1

这里有几件事。您可以通过将参数设置为下划线来设置分隔符而不是 CSV：

$("#mytags").tagit({
  ...
  singleFieldDelimiter: '_',
  ...

然后你可以在第 197 行修改 tag-it.js 文件以使用 ID 属性。

改变：

var tags = node.val().split(this.options.singleFieldDelimiter);

成为

var tags = node.attr("id").split(this.options.singleFieldDelimiter);

因此，假设您将隐藏字段修改为：

<input type="hidden" name="tags" class="mySingleField" id="Apple_Orange_Banana" value="Apple_Orange" disabled="true">

您可以这样修改 javascript 以获得所需的输出：

    $(document).ready(function () {
        $("#mytags").tagit({
            singleField: true,
            singleFieldNode: $('.mySingleField'),
            singleFieldDelimiter: '_',
            allowSpaces: true,
            minLength: 2,
            removeConfirmation: true,
            tagSource: function (request, response) {
                //console.log("1");
                $.ajax({
                    url: "../City/GetList",
                    data: { term: request.term },
                    dataType: "json",
                    success: function (data) {
                        response($.map(data, function (item) {
                            return {
                                label: item.label + " (" + item.id + ")",
                                value: item.value
                            }
                        }));
                    }
                });
            }
        });
   });
于 2013-03-27T04:06:19.477 回答
0

更改 tag-it.js 文件

第 264 行的评论

// that.createTag(that._cleanedInput());

// The autocomplete doesn't close automatically when TAB is pressed.
// So let's ensure that it closes.
// that.tagInput.autocomplete('close');

285号线附近

var autocompleteOptions = {
    select: function(event, ui) {
        that.createTag(ui.item);

创建一个新函数

assignedTagsData: function(){
    // Only to be used when singleField option is not seleted
    var tags = [];
    this.tagList.children('.tagit-choice').each(function() {
        tags.push($(this).data('tag_item_data') );
    });
    return tags;
}

that.createTag(ui.item);

创建标签

var tag = $('<li></li>')
    .data('tag_item_data',item) //add this line
    .addClass('tagit-choice ui-widget-content ui-state-default ui-corner-all')
    .addClass(additionalClass)
    .append(label);
于 2013-03-29T03:04:36.613 回答