代码之家  ›  专栏  ›  技术社区  ›  Brian J. Hakim

如何在我的MVC站点中制作ExtJs DatePicker?

  •  4
  • Brian J. Hakim  · 技术社区  · 15 年前

    我需要一个通过ExtJs在我的网页上的日期选择器小部件 works like this .

    日期选择器和 This sample with pickers

    问题是standart日期选择器看起来就像一个巨大的日历,上面有“今日”按钮。这个示例提供了我想要的picker(textbox字段和calendar on demand),但它在这里的面板中工作。我不想创建面板只是为了显示一个日期选择器。这个样本匹配得很好-我需要开始日期和结束日期也,但这个面板是sux。我只想要两个不带面板的独立选择器。

    据我所知,standart datepicker的思想是在页面上创建textbox,然后创建一个ExtJs脚本,在textbox click或类似的地方显示datepicker。

    我不擅长ExtJs,有人能给我演示一下如何在Asp-netmvc中通过ExtJs处理日期吗?

    1 回复  |  直到 15 年前
        1
  •  5
  •   Mariano Desanze    15 年前

    如果你不想 Today 在你的日期选择器中你只需要使用 showToday config option 在datePicker创建上。

    如果日期选择器不在面板中,就不要使用 FormPanel applyTo config option :

    var startdt = new Ext.form.DateField({
        applyTo: 'tbStartDt', // <-- here you say where it must be rendered
        fieldLabel: 'Start Date',
        name: 'startdt',
        id: 'startdt',
        vtype: 'daterange',
        endDateField: 'enddt', // id of the end date field
        showToday: false
    });
    
    var enddt = new Ext.form.DateField({
        applyTo: 'tbEndDt', // <-- here you say where it must be rendered
        fieldLabel: 'End Date',
        name: 'enddt',
        id: 'enddt',
        vtype: 'daterange',
        startDateField: 'startdt', // id of the start date field
        showToday: false
    });
    

    然后你的 html 页面将需要有2个ID输入: tbStartDt tbEndDt 我们在上面定义:

    Start Date: <input id="tbStartDt"></input>
    End Date: <input id="tbEndDt"></input>
    

    你可以试一下我的例子 jsfiddle.net/CrfvC/26/