Question

我需要在works like this的页面上通过ExtJs创建一个datepicker小部件。

我在ExtJs中找到的所有内容都是 DatePicker和This sample with pickers

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

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

我不是ExtJs的专家，有没有人可以通过Asp Net MVC中的ExtJs展示如何使用日期的样本？

Answer 1

如果您不想在日期选择器中使用Today按钮，则只需在datePicker创建时使用showToday config option。

如果DatePickers不在面板内，请不要使用示例中的FormPanel并创建定义applyTo config option的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页面需要输入带有ID的2个输入：tbStartDt和tbEndDt我们在上面定义：

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

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

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

1 个答案: