1

我有一个用作过滤器的表单。这是日期输入字段的代码。

<label>Date:</label>
<input type="text" id="dateFilter"
       ng-model="gridFilters.dateFilter"
       placeholder="MM/DD/YYYY"
       ng-disabled="loadingData" />
<span class="glyphicon glyphicon-calendar" style="width: 30px"></span>

当角度控制器初始化时，该gridFilters.dateFilter值设置为undefined并且不应默认为任何值。这是正确的行为。

这是我的提交按钮的代码。我希望该按钮保持禁用状态，直到用户选择/输入有效日期。

<button type="button"
        class="btn btn-success pull-right"
        style="top: -5px; margin-left: 20px"
        ng-click="filter()"
        ng-enabled="gridFilters.dateFilter!== null && gridFilters.dateFilter!== undefined && Date.parse(gridFilters.dateFilter)"
        ng-hide="session.Status !== 0">
    Search
</button>

如您所见，我已多次尝试检查该值的gridFilters.dateFilter值。这些都不起作用。具体来说，当我加载页面时，我的按钮已启用，就好像在选择器中输入了正确的日期一样。我如何测试日期值是否实际上是日期？此外，这必须在 Internet Explorer 中工作。我怀疑这会有所作为，但 IE 是我们公司首选的浏览器。

4

1 回答 1

2

您需要使用ng-disabled - 没有称为启用的 HTML 属性。

试试这个：

<button type="button"
        class="btn btn-success pull-right"
        style="top: -5px; margin-left: 20px"
        ng-click="filter()"
        ng-disabled="gridFilters.dateFilter === null || gridFilters.dateFilter === undefined || Date.parse(gridFilters.dateFilter)"
        ng-hide="session.Status !== 0">
    Search
</button>

这ng-disabled="gridFilters.dateFilter === null || gridFilters.dateFilter === undefined"是100％的工作

但是对于 Date.parse(gridFilters.dateFilter)我不确定它是否会起作用。

另一种方法是：

<form name="dataForm" novalidate ng-submit="submitForm()">
   <input type="date" name="date" class="form-control" required 
          ng-model="gridFilters.dateFilter">
   <button type="submit"
           class="btn btn-success pull-right"
           style="top: -5px; margin-left: 20px"
           ng-click="filter()"
           ng-disabled="dataForm.$invalid"
           ng-hide="session.Status !== 0">
      Search
   </button>
</form>
于 2020-02-21T21:40:10.857 回答