一、针对My97日历控件的绑定

普通绑定和特殊格式绑定(红色部分)

<!-- ko foreach: items -->
<td class="ruyeeTableTDLable"> <span>批准专业日期</span></td>
<td class="ruyeeTableDataCell">
    <div class="input-group">
        <input data-validation-engine="validate[maxSize[10]],validate[required],custom[date],"
               data-bind="attr: { id: 'A7615' +$index(),value:A7615} " type="text" class="form-control">
        <div class="input-group-addon ">
            <span class="glyphicon glyphicon-calendar"
                  data-bind="attr: { onclick: 'WdatePicker({ el:A7615' + $index() + '})' }">

            </span>
        </div>
    </div>
</td>
<td class="ruyeeTableTDLable"> <span>转业年份</span></td>
<td class="ruyeeTableDataCell">
    <div class="input-group">
        <input data-validation-engine="validate[maxSize[10]],validate[required],validate[date],"
               data-bind="attr: { id: 'A7616' +$index(),value:A7616} " type="text" class="form-control">
        <div class="input-group-addon ">
            <span class="glyphicon glyphicon-calendar"
                  data-bind="attr: { id: 'WP_A7616_' +$index()} "></span>
        </div>
    </div>
</td>
<!-- /ko -->
/// <reference path="../knockout-3.2.0.js" />
var koList;
var deletedIds = Array();
var ViewModel = function (data, func) {
    var self = this;
    self.items = ko.mapping.fromJS(data.items);
    self.struct = ko.mapping.fromJS(data.structV);
    builLeftNva(self);
    self.success = ko.observable();
    self.success.subscribe(function (nv) {
        var success = $.trim(nv);
        ) {
            $('#success').modal('show');
        }
    });
    self.canSubmit = ko.observable(false);
    self.submit = function () {
        if ($("#form_id").validationEngine("validate")) {
            ; i < koList().length; i++) {
                //时间格式转换
                koList()[i].A7615($('#A7615' + i).val());
                koList()[i].A7616($('#A7616' + i).val());
            }
            $.ajax({
                url: postOneModelActionUrl,
                contentType: "application/json",
                type: "POST",
                data: ko.mapping.toJSON({ items: self.items, deletedIdList: deletedIds }),
                success: function (response) {
                    self.success(response.Description);
                },
                async: false
            });
        }
    };

    self.closeSuccess = function () {
        self.success('');
        $('#success').modal('toggle');
    };

    self.deleteOne = function (item) {
        self.items.remove(item);
        if (item.ID() != null) {
            deletedIds.push(item.ID());
        }
    }
    self.addNew = function () {
        //新增时的特殊处理
        var js = ko.mapping.toJS(self.struct);
        js.A7615 = getDateString();
        js.A7616 = getDateString();
        var newItem = ko.mapping.fromJS(js);
        self.items.push(newItem);
        func();
    }
    self.canSubmit(true);
    $('#form_id').validationEngine();
    koList = self.items;
    //延时处理,解决KO性能问题
    setTimeout(func, );
}
var refreshList = function () {
    ; i < koList().length; i++) {
        //时间格式转换,如果是新增的(新增的ID为null)则无需转换
        if (koList()[i].ID != null) {
            $('#WP_A7616_' + i).click(function () {
                WdatePicker({
                    dateFmt: 'yyyy-MM',
                    el: $('#A7616' + this.getAttribute('id').split('_')[2]).attr('id')
                });
            })
            koList()[i].A7615(changeDateFormat(koList()[i].A7615()));
            koList()[i].A7616(changeDateFormat(koList()[i].A7616(), null, null, null, false));
        }
    }
};
$(document).ready(function () {
    $('#create').addClass('active');
    $.ajax({
        url: getStructActionUrl,
        contentType: "application/json",
        type: "POST",
        data: JSON.stringify({ A01ID: QueryString.GetValue('a01id') }),
        success: function (data) {
            ko.attach("A76Model", new ViewModel(data, refreshList));
        },
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            switch (XMLHttpRequest.status) {
                :
                    changeLocationToLogin();
                    break;
            }

        }
    });
})

knockout+bootstrap--一些复杂的应用合集的更多相关文章

  1. 从零开始学数据分析,什么程度可以找到工作?( 内附20G、5000分钟数据分析工具教程大合集 )

    从零开始学数据分析,什么程度可以找到工作?( 内附20G.5000分钟数据分析工具教程大合集 )   我现在在Coursera上面学data science 中的R programming,过去很少接 ...

  2. 不容错过的UI设计素材大合集

    免费PSD素材 TETHR by InVision 这是出自InVision的8款PSD文件,其中包含了100个模板和超过500个UI控件.来自InVision和UI8的设计师一同协作完成了这套UI ...

  3. 你想找的Python资料这里全都有!没有你找不到!史上最全资料合集

    你想找的Python资料这里全都有!没有你找不到!史上最全资料合集 2017年11月15日 13:48:53 技术小百科 阅读数:1931   GitHub 上有一个 Awesome - XXX 系列 ...

  4. 最新最全的 Android 开源项目合集

    原文链接:https://github.com/opendigg/awesome-github-android-ui 在 Github 上做了一个很新的 Android 开发相关开源项目汇总,涉及到 ...

  5. 超全的 Vue 开源项目合集,签收一下

    超全的 Vue 开源项目合集,签收一下 xiaoge2016 前端开发 1周前 作者:xiaoge2016 链接: https://my.oschina.net/u/3018050/blog/2049 ...

  6. SQL Server技术内幕笔记合集

    SQL Server技术内幕笔记合集 发这一篇文章主要是方便大家找到我的笔记入口,方便大家o(∩_∩)o Microsoft SQL Server 6.5 技术内幕 笔记http://www.cnbl ...

  7. 【Android】开发中个人遇到和使用过的值得分享的资源合集

    Android-Classical-OpenSource Android开发中 个人遇到和使用过的值得分享的资源合集 Trinea的OpenProject 强烈推荐的Android 开源项目分类汇总, ...

  8. [Erlang 0122] Erlang Resources 2014年1月~6月资讯合集

    虽然忙,有些事还是要抽时间做; Erlang Resources 小站 2014年1月~6月资讯合集,方便检索.      小站地址: http://site.douban.com/204209/   ...

  9. [Erlang 0114] Erlang Resources 小站 2013年7月~12月资讯合集

    Erlang Resources 小站 2013年7月~12月资讯合集,方便检索.     附 2013上半年盘点: Erlang Resources 小站 2013年1月~6月资讯合集    小站地 ...

随机推荐

  1. Redis 无法正常关闭服务

    前置知识:Redis最简单的基本命令: 1. 系统终端 ./redis-server 启动redis服务 ./redis-cli 启动redis客户端 ./redis-cli shutdown 关闭r ...

  2. [转] 添加新的系统调用 _syscall0(int, mysyscall)

    实验目的阅读 Linux 内核源代码,通过添加一个简单的系统调用实验,进一步理解Linux操作系统处理系统调用的统一流程.通过用kernel module的方法来实现一个系统调用实验,进一步理解Lin ...

  3. _crol_和_cror_函数

    “_crol_” 与“_cror_”其实就是左右循环代码,其具有程序代码简单执行效率高的优点! 是在单片机c语言编程中常用到的,变量=_crol_(变量名,移动位数),例如:P0=_crol_(P0, ...

  4. See you~_树状数组

    Problem Description Now I am leaving hust acm. In the past two and half years, I learned so many kno ...

  5. Voreen(三) 光线投射参数介绍

    本篇介绍光线投射的第二个个制Pass,光线合成的参数,对应于第一篇总的流程介绍中的Processor SingleVolumeRaycaster.可设置的参数如下: 1,Sampling Rate 采 ...

  6. [WPF]GridView或DataGrid中自定义样式:依据某一列设定其对应行的样式(背景色,字体等)

    附效果照一张: 本方法使用StyleSelector来 获得依据自定义逻辑的style. ① class ConditionalStyleSelector : StyleSelector { publ ...

  7. 利用spring AOP 和注解实现方法中查cache-我们到底能走多远系列(46)

    主题:这份代码是开发中常见的代码,查询数据库某个主表的数据,为了提高性能,做一次缓存,每次调用时先拿缓存数据,有则直接返回,没有才向数据库查数据,降低数据库压力. public Merchant lo ...

  8. [非原创]eclipse中一些常见svn图标的含义

    项目视图   The Package Explorer view - 已忽略版本控制的文件.可以通过Window → Preferences → Team → Ignored Resources.来忽 ...

  9. Hot code replace failed

    今天在eclipses中 修改代码,保存时会出时不时出现Hot code replace failed 对话框,谷歌提示是在debug模式下保存修改源代码会出现此类问题.确实,刚刚在用debug功能, ...

  10. You need to use a Theme.AppCompat theme (or descendant) with this activity

    经过本人的经验和在网上查找,有2种方法可以解决. 解决步骤已经写到我的公众号,二维码在下面. 欢迎观看我的CSDN学院课程,地址:http://edu.csdn.net/course/detail/2 ...