Tag: knockout.js

使用敲除突出显示所选行

参考下面的问题在stackoverflow中提出 显示点击的项目 我修改了约翰爸爸创造的小提琴。 这是我更新的小提琴 http://jsfiddle.net/6FCEe/31/ 我添加了新按钮并单击它我推新记录。在新按钮的点击事件中我添加了下面的代码 this.NewDetail = function(){ self.model.Things.push(new Thing(4, “Thing 4”, self.model.CurrentDisplayThing) ); self.model.CurrentDisplayThing(item); }; 但是新行并没有显示出来。 我该怎么做才能突出它。 添加的新行应显示为黄色的高亮显示。

Knockout textInput和maskedinput插件

是否有一种简单的方法可以使用data-bind=”textInput: aProperty”并在用户输入时添加输入掩码或一些自动格式? 使用蒙面输入插件的工作方式,但我失去了Knockout的“textInput:”提供的“as-you-type”更新,因此脚本的其他部分只能在字段失去焦点后看到更改(有效地表现为平面在Knockout中使用旧的“value:”绑定。 一个具有计算可观察性的天真解决方案,格式化不起作用,因为每次更新自动字段的按键都会将输入焦点更改为页面中的其他位置,因此用户无法继续输入。 我可以让这两个库彼此玩得很好,还是应该制作我的自定义解决方案? 他们在事件处理程序中做了很多事情,以便与所有浏览器兼容,所以很难让它们一起工作并不奇怪,但这也正是为什么我不想摆弄所有这些键盘,输入,改变,事件由我自己。 StackOverflow之前的所有答案都不介意在字段失去焦点后传播更改。 也许那些答案是在textInput被添加到Knockout之前发布的,所以当时没有更好的东西。 这就是我问一个新问题的原因。

如何使用元素来获取数据绑定键和值observable?

我需要使用element获取数据绑定键和值observable。 var ViewModel = { selectOptions:ko.observableArray([…]), selectedValue:ko.observable() … some other stuff … } 在其他viewmodel中,我现在可以访问dom元素,我需要更新元素的绑定上下文observable。 如何获取数据绑定键和值? 我需要这样的东西 { options:selectOptions, value:selectedValue }

使用Knockout.js控制Flash插件,冲突jQuery.tmpl和Knockout-Sortable

我正在尝试使用Knockout.js的本机模板function来呈现HTML以嵌入Flash对象。 jQuery.tmpl完美地完成了这项工作,但由于与Knockout-sortable插件冲突,我无法使用它。 以下是使用本机模板进行怪癖的flash插件示例: http : //jsfiddle.net/7y3ub/35/ 在Chrome中,玩家永远不会出现。 在Firefox中,如果在选中复选框时更改频道,则播放器将显示。 然而,重新检查该框会让玩家再次消失。 ‘if’绑定是必要的,因为在页面持续时间内可能存在许多flash插件加载和卸载的实例。 据我所知,当object / embed标签进入可见DOM时,HTML需要全部到位。 这就是jQuery.tmpl在我的情况下会很棒的原因。 我自己尝试形成HTML字符串,但我不知道如何应用和维护新标记包含的绑定。 最重要的是,我要么需要一种方法来立即呈现HTML,同时仍然支持绑定,或者找到一种方法使jQuery.tmpl和Knockout-sortable相互兼容。 这是一个不兼容的例子: http : //jsfiddle.net/7y3ub/41/ 如果您只是引用jQuery.tmpl,那么该示例中的代码将完美地运行。 http://jsfiddle.net/7y3ub/42/ 控制台中的错误消息似乎暗示上下文未正确调整,或者隐含的foreach未执行。 在这个调整中,消息变得更加不寻常,其中SubItem对象被简单的字符串替换: http : //jsfiddle.net/7y3ub/43/

如何在i18next中使用Knockout observable?

我试图以某种方式动态地使用i18next翻译和Knockout.js,但我无法弄清楚如何。 自定义Knockout绑定或i18next jQuery插件似乎都不适用于可观察值。 我可以在这里找到我想要实现的演示: http : //jsfiddle.net/rdfx2/1/ 解决方法是这样的,但我宁愿避免这种情况,如果可能的话: self.translate = function (key, value) { return i18next.t(key, { “var”: value }); }; 谢谢,

使用jquery ui datepicker的Knockout.js可以在IE以外的任何地方使用

我使用knockout.js templatescript创建了一个可以复制和删除的表单。 小提琴可以在这里找到。 我使用SE的litle帮助编写脚本以添加jquery-ui datepicker。 小提琴的简短版本可以在[这里] [2]找到。 到目前为止一切都那么好,但是在测试时我发现除了IExplorer(各种版本)之外,一切都可以在任何浏览器中运行。 问题出在这个特定的部分,但我不知道在哪里。 script type=’text/javascript’>//<![CDATA[ ko.bindingHandlers.datepicker = { init: function (element, valueAccessor, allBindingsAccessor) { var options = allBindingsAccessor().datepickerOptions || {}; console.log("datepicker"); $(element).datepicker(options); //handle the field changing ko.utils.registerEventHandler(element, "change", function () { var observable = valueAccessor(); observable($(element).datepicker("getDate")); }); //handle disposal (if KO removes by the template binding) ko.utils.domNodeDisposal.addDisposeCallback(element, function () […]

将KnockoutJS与多个页面一起使用

我刚开始学习KnockoutJS。 有一点我很困惑,样本似乎都集中在一个具有单一视图模型的视图上。 如何处理更大的应用程序? 我将编写一个纯html / jquery应用程序。 所有数据都通过ajax作为json提供。 应用程序顶部有一个公共导航标题,其中有多个标签和子标签通过Twitter Bootstrap实现。 如果我将应用程序的每个页面构建为单独的html视图和js viewmodel,我该如何维护单个统一标头? 如果这是服务器端的asp.net webforms,我会使用Master Pages。 但这都是客户端。 Knockout中有什么东西可以解决这个问题吗? 或者也许是另一个解决这个问题的图书馆? 我想我可以在一个大的html页面中编写应用程序,但它会相当大。 一定有更好的方法。

淘汰赛检查/取消选中所有combobox

我使用knockout将JSON obejct映射到用户控件,我有一个单独的复选框列表,它们看起来像 我有JsonObject var viewModel = { IsEnabled1 :ko.observable(true), IsEnabled2 :ko.observable(true), IsEnabled3 :ko.observable(false) }; … ko.applyBindings(viewModel); 我想添加将检查/取消选中所有其他的全局复选框,我在JavaScript端进行了此更改但是全局复选框更新了UI部分但是它们来自单独的复选框的数据没有映射到JSON对象。 全局复选框 $(“#GeneralTable thead tr th:first input:checkbox”).click(function () { var checkedStatus = this.checked; $(“#GeneralTable tbody tr td:first-child input:checkbox”).each(function () { this.checked = checkedStatus; }); }); 在此代码之后,我的JSON对象包含与UI无关的数据。 如何更新JS方面的更改后的所有JSON复选框?

从knockout.js的下拉列表中更新对象

尝试在下拉列表中编辑对象。 选择项目时, name和suffix显示在可编辑的文本字段中; 我可以编辑(并保存) name ,但suffix更改不会粘。 这是JS代码,其余的是小提琴: http : //jsfiddle.net/raffian/4kXXc/1/ function Domain(n){ var self = this; self.name = ko.observable(n); self.suffix = ko.observable(); }; function DomainsViewModel(){ var self = this; self.domains = ko.observableArray([]); self.newDomain = ko.observable(“”); self.selectedDomain = ko.observable(); self.addNewDomain = function() { self.domains.push(new Domain(self.newDomain())); self.newDomain(”) }; }; ko.applyBindings(new DomainsViewModel());

用搜索删除地图图钉

我正在尝试创建一个搜索栏,如果它们与搜索查询不匹配,则会从列表中过滤掉项目。 我想要添加的附加function是,如果它与搜索查询不匹配,它也会从地图中删除引脚。 这就是我现在所拥有的,它适用于删除页面顶部的名称,但ID也可以删除引脚。 我想知道如何解决这个问题。 self.pins = ko.observableArray([ new self.mapPin(“Waterloo Station”, 51.503035, -0.112326, “test3″”), new self.mapPin(“King’s Cross Station”, 51.530984, -0.122583, “test2”), new self.mapPin(“Putney Bridge”, 51.468050, -0.209081, “test1″) ]); self.query = ko.observable(”); self.filterPins = ko.computed(function () { var search = self.query().toLowerCase(); return ko.utils.arrayFilter(self.pins(), function (pin) { return pin.name().toLowerCase().indexOf(search) >= 0; }); }); HTML: 任何帮助,将不胜感激!