Question

我正在使用x-editable rowform表来显示一些可编辑的内容。每行包含一个带有编辑/删除按钮的表单，如果行表格处于活动状态，则该表单将更改为提交/取消按钮。

而不是向表中插入一个空的新行的“添加”按钮，我希望有一个模式显示一个表格，用于填充新行的所有数据。直到这里一切正常。

模态打开，可以填写数据，并且单击模态中的另一个“添加”按钮，将模态表单的数据插入到新的行表单中。

唯一的问题：rowform仍处于活动状态且尚未提交。我需要点击表格行中的“提交”按钮来保存更改。

如何在控制器中提交活动的rowform？

模态

    <div id="modal-addStudent" class="modal fade animate" data-backdrop="true">
      <form>
        FORM ELEMENTS

        <button type="reset" data-dismiss="modal">Close</button>
        <button type="submit" ng-click="addTR(insert)" data-dismiss="modal">Add</button>
      </form>
    </div>

表格

    <table>
      <tr>
        TDs...
        <td>
          <button type="button" data-toggle="modal" data-target="#modal-addTR" class="btn btn-xs white pull-right">
            <i class="material-icons">&#xe145;</i> Add
          </button>
        </td>
      </tr>
      <tr ng-repeat="tr in trs | filter:filterTrs">
        TDs
        <td style="white-space: nowrap">
          <form editable-form name="rowform" onbeforesave="saveTR(tr)" ng-show="rowform.$visible" class="form-buttons form-inline pull-right" shown="inserted == tr">
            <button type="submit" ng-disabled="rowform.$waiting">Submit</button>
            <button type="button" ng-disabled="rowform.$waiting" ng-click="cancel()">Cancel</button>
          </form>

          <div class="controls pull-right" ng-show="!rowform.$visible">
            <button class="btn white btn-xs" ng-click="rowform.$show()">
        Edit
            </button>
            <button class="btn white btn-xs" ng-click="deleteTR($index)">
        Del
            </button>
          </div>  
        </td>
      </tr>
    </table>

在控制器中添加TR的功能

    function addTR(tr) {
      vm.inserted = {
        id: vm.students.length+1,
        data: tr.data,
        isNew: true
      };

      vm.trs.unshift(vm.inserted);

      //rowform should be submitted here
    };

在角度控制器中提交x-editable表单？

0 个答案: