Knockout.js用MVC填充来自服务器的数据 - javascript

我正在尝试使用服务器中的一些初始值填充基因敲除视图模型,我使用的是ASP.Net MVC,所以我将其传递给视图的是mvc视图模型:

public ActionResult Edit(int cvId)
{
    CV cv = repository.FindCV(cvId);

    //auto mapper mapping
    Mapper.CreateMap<CV, MyCVViewModel>();
    Mapper.CreateMap<Company, MyCompanyViewModel>();
    Mapper.CreateMap<Education, MyEducationViewModel>();
    Mapper.CreateMap<Reference, MyReferenceViewModel>();
    var model = Mapper.Map<CV, MyCVViewModel>(cv);

    return View(model);
}

在视图内部,我将viewmodel转换为json字符串,并将其绑定到kickoutjs viewmodel,因此它填充了数据:

//mvc viewmodel
@model Taw.WebUI.Models.MyCVViewModel
//convert
@{
    var json = @Html.Raw(Model.ToJson());
}

//lastly bind
<script type="text/javascript">
    // Activate knockout binding
    var viewModel = new CVViewModel(@json);
    ko.applyBindings(viewModel);
</script>

在我的剔除javascript中,我用数据填充剔除viewmodel:

var CVViewModel = function (data) {
    var self = this;

    //list view model
    self.title = ko.observable(data.title);
    self.statement = ko.observable(data.statement);
    self.reference = ko.observable(data.reference);
    self.companies = ko.observableArray(data.companies);
    self.educations = ko.observableArray(data.educations);
    self.references = ko.observableArray(data.references);
}

在此阶段,一切都已填充:

生成的json字符串为:

问题:

1.问题是某些值在我更改时不会绑定,只有标题和语句会更改:

如您所见,生成的json仅更改标题和声明,并且公司内部的值不变

2.再次保存该数据时,如何让服务器端知道已编辑的内容和已删除的内容,如何使用MVC和实体框架跟踪它们,并相应地更改数据库

更新资料

我的淘汰赛javascript,我已经定义了这些可观察对象,如何在observablearray中定义它们

function Company() {
    this.companyName = ko.observable();
    this.jobTitle = ko.observable();
    this.description = ko.observable();
    this.startDate = ko.observable();
    this.endDate = ko.observable();
}

参考方案

对于第一个问题:

问题是您需要为每个数组项使用ko.observable

例如:jsfiddle

function CVViewModel(data) {
    var self = this;

    //list view model
    self.title = ko.observable(data.title);
    self.companies = ko.observableArray(data.companies.map(Company));
}

function Company(data) {
    if (!(this instanceof Company)){
        return new Company(data);
    }
    this.companyName = ko.observable(data.companyName || '');
    this.jobTitle = ko.observable(data.jobTitle || '');
    this.description = ko.observable(data.description || '');
    this.startDate = ko.observable(new Date(data.startDate) || '');
    this.endDate = ko.observable(new Date(data.endDate) || '');
}

现在,当您将公司可观察对象绑定到UI时,视图模型上的每个数组元素都将保持同步。

关于第二个问题,我建议使用像breeze.js这样的ORM来为您进行更改跟踪。 Breeze.js的tutorial使用knockout.js。

Javascript-从当前网址中删除查询字符串 - javascript

单击提交按钮后,我需要从网址中删除查询字符串值。我可以用jQuery做到这一点吗?当前网址:siteUrl/page.php?key=value 页面提交后:siteUrl/page.php 实际上,我已经从另一个带有查询字符串的页面着陆到当前页面。我需要在页面首次加载时查询字符串值以预填充一些详细信息。但是,一旦我提交了表格,我就需要删除查询字符串值。我已…

Javascript IF语句 - javascript

                        嗨,我有这段代码可以正常工作,并将两个日历显示为一个日历。我还有一个php变量$login_session,其中包含登录电子邮件地址的用户。关于如何显示[email protected]日历的任何想法(伪代码)IF $login_session == "[email protected]&#…

如何根据手势滚动网页 - javascript

如何使用pyhton / javascript使用手势向上/向下或向左/向右滚动页面。我尝试了很多找到解决方案,但无法解决。 参考方案 Javascript手势插件(JSHG)是一个很棒的插件,它使您可以通过现有网站或Web应用程序中的网络摄像头来支持用户的手势识别。您无需具有计算机视觉的任何背景即可使用此插件。当前,它提供了一组基本的手势,其中包括手的位置…

从一个脚本到另一个脚本的统一变量访问 - javascript

所以我有一个统一的3D文本上的文本网格脚本,我希望它从具有OnMouseDown函数的多维数据集中访问一个变量,在该函数内部它会更改分数,并且我希望将该分数输出到文本。当我在CS中编写文本脚本时,多维数据集脚本是用JavaScript编写的。谁有想法? 参考方案 如果我误解了您的问题,请纠正我。选项1:C#代码在js代码之前进行编译,这意味着您无权从c#代码…

在文本字段中键入时显示预制建议列表 - javascript

如标题所说我正在处理一个mysql项目,我希望该文本字段在键入它时向现有用户提供建议(管理员控制页以禁止用户..类似的东西)一个简单的例子来解释:当我输入文字时..我想给用户输入建议假设他正在输入颜色名称所以当他在其中输入b在他继续之前,会出现一个列表,向他提供我们预先设定的建议,例如:黑色棕色蓝色然后如果他输入l为bl该列表将是:黑色蓝色布拉布拉有什么建议…