0

更新此 问题已在 github 中讨论过

我在引导程序 3 中使用带有 typeahead 的 tagsinput。我遇到的问题是如果用户选择现有标签的值。显示文本显示正确，但 .val() 返回其实际对象。下面是代码

 $('#tags').tagsinput({
                        //itemValue: 'value',
                        typeahead: {
                            source: function (query) {
                                //tags = [];
                                //map = {};
                                return $.getJSON('VirtualRoomService.asmx/GetTags?pid=' + $("#<%=hdnPID.ClientID%>").val() + '&tok=' + query)
                                //, function (data) {
                                //    $.each(data, function (i, tag) {
                                //        map[tag.TagValue] = tag;
                                //        tags.push(tag.TagValue);
                                //    });
                                //    return process(tags);
                                //});
                            }
                        }
                        //freeElementSelector: "#freeTexts"
                    });

上面代码的问题是它在从 web 方法中获取标签时结果如下 在此处输入图像描述

当用户选择现有标签时会发生这种情况。新标签没有问题。我尝试设置标签输入的 itemValue 和 itemText 但没有奏效。因此，我决定解决这个问题。因为我可以将 json 字符串作为 ['IRDAI", Object]，如果可以以某种方式解析这些对象并获得实际的标签值，那么我会得到我正在查看的代码的预期结果。

下面是它在标签输入中显示为 [object Object] 的内容，用于用户从自动填充下拉列表中选择的文本 [！[输入 imt 如果我将 TagId 和 TagValue 指定为 itemValue 和 itemText，如下代码所示

            $('#tags').tagsinput({
                itemValue: 'TagId',
                itemText: 'TagValue',
                typeahead: {
                    source: function (query) {
                        //tags = [];
                        //map = {};
                        return $.getJSON('VirtualRoomService.asmx/GetTags?pid=' + $("#<%=hdnPID.ClientID%>").val() + '&tok=' + query)
                        //, function (data) {
                        //    $.each(data, function (i, tag) {
                        //        //map[tag.TagValue] = tag;
                        //        tags.push(tag.TagValue);
                        //    });
                        //});
                        //  return process(tags);

                    }
                }
                //freeElementSelector: "#freeTexts"
            });

然后执行以下代码时结果显示如下

var arr = junit.Tags.split(',');

                            for (var i = 0; i < arr.length; i++) {
                                $('#tags').tagsinput('add', arr[i]);
                            }

在此处输入图像描述

在此处输入图像描述

4

2 回答 2

1

给定来自数据源的示例 JSON 响应：

[
  {"TagId":"1", "TagValue":"eSign"},
  {"TagId":"2", "TagValue":"eInsurance Account"}
]

您需要告诉 tagsinput 如何使用itemValue和itemText在您的 tagsinput 配置对象中映射响应对象的属性。看起来您可能已经开始走这条路，但没有得出结论，应该如下所示：

$('#tags').tagsinput({
  itemValue: 'TagId',
  itemText: 'TagValue',
  typeahead: {
    source: function (query) {
      return $.getJSON('VirtualRoomService.asmx/GetTags?pid=' + $("#<%=hdnPID.ClientID%>").val() + '&tok=' + query);
    }
  }
});

请务必查看标签输入示例。

于 2016-07-23T16:52:34.990 回答
0

这可能不是干净的解决方案，但我通过以下解析方法解决了这个问题。希望这可以帮助某人。

            var items = $('#tags').tagsinput("items");
            var tags = '';
            for(i = 0; i < items.length; i++)
            {
                if(JSON.stringify(items[i]).indexOf('{') >= 0) {
                    tags += items[i].TagValue;
                    tags += ',';
                } else {
                  tags += items[i];
                  tags += ',';
                }
            }
于 2016-07-23T19:01:11.983 回答