- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在使用 http://aehlke.github.com/tag-it/在我的代码中
如何与 View 模型绑定(bind)
html
<ul data-bind='jqueryui: "tagit",foreach: Tags' >
<li class="tagit-choice ui-widget-content ui-state-default ui-corner-all" data-bind='with: $data'>
<span class="tagit-label" data-bind='text: $data'></span>
<a class="tagit-close">
<span class="text-icon">×</span>
<span class="ui-icon ui-icon-close"></span>
</a>
<input type="hidden" name="item[tags][]" data-bind='value: $data' style="display: none;">
</li>
</ul>
function AppViewModel() {
var self = this;
function Tag(data) {
this.Name = data;
}
self.Tags = ko.observableArray([
new Tag('red'),
new Tag('blue'),
new Tag('green')
]);
}
// Activates knockout.js
ko.applyBindings(new AppViewModel());
最佳答案
这是基于罗伯特瓦格纳的回答的另一个用于 knockout 的绑定(bind)处理程序,因为我觉得它不够动态:
ko.bindingHandlers.tagit = {
//https://github.com/aehlke/tag-it
init: function (element, valueAccessor, allBindingsAccessor) {
var bind = function () {
valueAccessor().tags($(element).tagit("assignedTags"));
};
var options = $.extend({
allowSpaces: false,
caseSensitive: false,
showAutocompleteOnFocus: true,
afterTagAdded: function(t,s) { bind(); },
afterTagRemoved: function(t,s) { bind(); },
placeholderText: "",
preprocessTag: function () { },
beforeTagAdded: function (evt, tag) {
if (tag.tagLabel.length == 0 || tag.tagLabel.toLowerCase() === options.placeholderText.toLowerCase()) {
return false;
}
return true;
}
}, valueAccessor().options || {});
var tags = valueAccessor()["autocomplete"];
if (tags)
$.extend(options, {
autocomplete: $.extend({ source: tags.source, delay: 0, minLength: 0 },tags)
});
$(element).tagit(options);
},
update: function (element, valueAccessor) {
var value = ko.utils.unwrapObservable(valueAccessor());
var tags = value.tags();
$(element).tagit("removeAll");
for (var x = 0; x < tags.length; x++) {
$(element).tagit("createTag", tags[x]);
}
}
};
self.TagAutocompleter = function (d, ds) {
DataMethod.postData("tag/autocomplete", d, function (data) {
ds(ko.utils.arrayMap(data, function (t) { return t.Tag; }));
});
};
self.TagProcessor = function (tag) {
return tag.toLowerCase().replace("#", '');
};
<ul data-bind="tagit:{tags:Tags, autocomplete:{source:TagAutocompleter, delay:250, minLength: 2}, options:{preprocessTag: TagProcessor}}">
</ul>
关于knockout.js - 如何在 knockout 中使用 tagit,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12855157/
我试图让“li.tagit-new input”覆盖父 ul.tagit 其余部分的整个宽度: ul.tagit li { display:table-cell; white-spac
这是代码: $("#AddFriendToGroup").tagit({ autocomplete: { source: fu
我正在尝试在我的 .net 应用程序中实现 jquery tag it 插件版本 v2.0。自动完成仅显示单个字符,例如“C”,即它在所有字符串中重复的类型数量。这是我正在使用的代码。请建议如何修复它
正如问题中提到的,我们正在使用 JQuery Tagit对于我们的项目。我们使用 ajax 搜索来填充关键字。我们在这里面临的问题是,当用鼠标单击搜索结果时,它的工作原理与描述的完全一样,但是,如果我
在rails 4.0中,我尝试使用jquery tagit()插件实现标签输入字段。在此插件中,用户应从自动完成列表中选择输入标签,而不是通过自定义条目。这里我怎样才能避免自定义条目呢?同样在这里,我
我在使用 Jquery TagIt 时遇到问题。它工作正常,但是当我从数据库中提取记录并使用 foreach 循环显示它们时,它会像应有的那样显示标签,但然后在末尾添加一个 x 作为文本。 第二个 x
我需要从 tagit 获取值,我该怎么做?在 afterTagAdded 中,我调用 Controller 并将对象保存在 List<> 中,但我不知道如何获取该值。我需要在这里发送 -->data:
我正在使用 jquery TagIt。我知道如何使用 if 和 isNaN 验证输入。但是,如果有人向我展示如何验证输入标签,我将不胜感激如果不是数字则将其删除: 以下代码对我不起作用(仍然接受字母数
我正在使用 jQuery tagit.. 在右上角有一个小的关闭按钮,用于删除标签。 我现在的问题是,有没有一种方法可以通过点击标签来删除标签? 最佳答案 首先,要从关闭元素中删除“x”:转到 tag
我正在使用 jquery.webspirited.coms tagit jquery,它在创建标签的意义上工作正常,在前端分离,但是当我发布数据时,它只将最后一个标签作为值发布到数据库.. 除了在 h
我是使用 tag-it 的新手。下面我贴代码。早些时候,自动完成功能不起作用,但现在可以。原因是它没有显示我在数组中添加的所有单词。 新.html TODO suppl
我正在使用以下 tag-it 插件:http://widen.github.io/jQuery-Tagit/ . 我想验证标签,输入是电子邮件地址。我该怎么做? 我的代码: HTML J
我正在使用以下 tagit 插件 http://webspirited.com/tagit/ 这是我尝试测试此插件的 html 页面的代码片段 - 用户在其中键入标签 apple orangex
当用户从输入标签中键入值时,如何显示标签中没有的特殊字符(~!@#...等)和数字(0-9)?是否可以限制普通文本中的特殊字符和数字显示?任何帮助将不胜感激。 当前输出:
我创建了一个按钮来添加新字段,我想添加的字段是按钮单击时的 tagit 字段,数据已完美添加,但 tagit 功能不起作用,它添加为空白 ul。我不知道为什么它不将 ul 转换为 tagit 字段。有
单击清除查询框链接 (id clearQueryBox) 后,我想调用 tagit("destroy") 方法来清空标签。这是因为有时用户一次复制并粘贴大约 10 个标签来进行搜索,因此如果他们可以一
您好,我正在使用 java play 框架,我想在我的项目中实现 JQuery Tagit。 我正在做他们网站上写的完全相同的事情,但我无法设法检索所选值的值。这是代码: $(document).
在寻找向 jquery tagit 添加标签的方法时,我遇到了以下代码片段: $('.tagfilter').click(function(){ $('#addtags').tagit('ad
使用 jquery Tagit 并希望将 css 焦点应用到 UL 标记。 我想不出一种方法来做到这一点,我对 jquery 的尝试还没有成功。 我试过例如: $( "#addtags" ).cli
我使用 https://github.com/aehlke/tag-it这个用于自动完成标记的插件 用户只需从现有数组sampleTags中取出标签 在添加标签之前我检查元素是否在数组中 before
我是一名优秀的程序员,十分优秀!