如何在我的MVC站点中创建ExtJs DatePicker？

Question

我需要我的网页上通过ExtJS的一个日期选择器小工具, 是这样的.

我在ExtJs中找到的所有东西都是DatePicker和这个带拾取器的样本

问题是标准的DatePicker看起来就像一个带有"今天"按钮的巨大日历.该示例提供了看起来像我想要的选择器(文本框字段和日历按需),但它在此处的面板中工作.我不想创建面板只是为了显示一个datepicker.这个样本非常匹配 - 我也需要startdate和enddate,但是这个面板是sux.我只想要两个单独的选择器,没有任何面板.

据我所知,标准的datepicker的想法是你在你的页面上创建文本框,然后你创建一个ExtJs脚本,你在文本框点击或类似的东西上显示datepicker.

我不是ExtJs的专家,任何人都可以通过Extps在Asp Net MVC中展示如何处理日期的示例吗？

Answer 1

如果您不想在datepickers中Today使用该按钮,则只需在datePicker创建时使用showTodayconfig选项.

并且对于DatePickers不在面板内部,只是不要FormPanel在示例中使用并创建定义applyToconfig选项的datePickers :

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页面需要与IDS有2个输入:tbStartDt和tbEndDt我们上面定义的:

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

您可以测试我在jsfiddle.net/CrfvC/26/中创建的示例.