Question

在处理项目时我遇到了一个问题，我需要禁用一个按钮，只要有两个不同的表（行中有一个ng-repeat，而每行有一个必需的输入）就是空的田野还在。所以基本上：

<table class="table table-striped fontsize12">
<thead>
    <tr>
        <th class="width-desc-auto">Description</th>
        <th class="width-reg-auto">Value</th>
    </tr>
</thead>
<tbody>
    <tr ng-repeat="item in items">
        <td><h6>{{item.DESCRIPTION}}</h6></td>
        <td>
            <input type="text" class="form-control" ng-model="item.VALUE" 
                   placeholder="{{item.VALUE}}" disabled="true" required
            >
        </td>
    </tr>
</tbody>

并且：

    <table class="table table-striped fontsize12">
<thead>
    <tr>
        <th class="width-desc-auto">Description</th>
        <th class="width-reg-auto">Value</th>
    </tr>
</thead>
<tbody>
    <tr ng-repeat="char in chars">
        <td><h6>{{char.DESCRIPTION}}</h6></td>
        <td>
            <input type="text" class="form-control"
              ng-model="char.VALUE" placeholder="Register Value" required
            >
        </td>
    </tr>
</tbody>

第一个被自动填充，但在某些情况下它们仍然可能是空的，而第二个必须手动输入。我重复的实际数组并不重要。现在我通过在两个表周围放置一个表单标签并在该表单标签中包含该按钮来解决它。：

<form name="myForm">
     <table>...</table>
     <table>...</table>
     <span class="pull-right">
         <button class="btn btn-sm btn-primary" type="button" ng-disabled="myForm.$invalid">
           Close
         </button>
     </span>
</form>

这有效，但是如果我需要将两个表放在不同的表格中呢？例如autoForm和manualForm？我是否还需要将实际按钮放在表单标签中？因为如果我把它放在外面它似乎没有用。

如果以前曾经问过我，我很抱歉，但我找不到它。 Ty提前。

Answer 1

只要表格在同一范围内，您实际上不需要表单标记。您可以在ng-disabled指令中检查两个输入字段的值，并相应地禁用它例如，你可以使用

<button class="btn btn-sm btn-primary" type="button" 
        ng-disabled="!(item.value && char.value)"
>
  Close
</button>

在这种情况下，按钮仅在两个输入类型都已填充时启用

Ng-disabled按钮基于两种不同的形式

1 个答案: