我有一个使用 Knockout JS 填充 JSON 数据的列表。
使用 YUI 委托,每个列表元素都是可拖动的,有几个放置目标(使用 YUI dd-drop-plugin
)。
当我在其中一个放置目标上放置一个列表项时,我希望现有表单中填充来自已放置项的数据的数据(即使数据未显示在列表中,但位于数据模型中)。如果没有任何内容被丢弃,我仍然希望用户能够编辑表单并提交它。
我原来的看法是:
<ol class="timeline" data-bind="foreach: $data">
<li>
<p data-bind="text: Title"></p>
</li>
</ol>
由以下人员填充:
$.getJSON(timelineURL, function(data) {
var viewModel = ko.mapping.fromJS(data);
ko.applyBindings(viewModel, document.getElementById("preleads"));
});
然后我有 YUI dd:
YUI().use('dd-delegate', 'dd-drag','dd-drop-plugin', 'dd-proxy', function(Y) {
// Make all the .timeline items draggable
var draggables = new Y.DD.Delegate({
container: ".timeline",
nodes: "li"
});
// ... some setting up of the proxy elements, etc.
var dropNew = Y.one("#addStoryForm").plug(Y.Plugin.Drop);
dropNew.drop.on("drop:hit", function(e){
// The bit I'm missing
});
});
它应该使用来自已删除元素的数据填充表单:
<form data-bind="with: droppedItem">
<input type="text" data-bind="value: Title" />
<input type="text" data-bind="value: SomethingElse" />
<button type="submit" />
</form>