【问题标题】:Saving on page change in pagination not working. Values are not Saved在分页中保存页面更改不起作用。值未保存
【发布时间】:2017-01-20 01:16:59
【问题描述】:

我有一个可以编辑的表格。但是,如果我使用分页更改页面,则编辑的值将被删除。我已经尝试在更改页面时调用我的保存功能,但效果不佳。
我有一个这样的表:

...
<table>
...
<th>
              <span class="input-group-btn">
                <button type="button" class="btn btn-default" ng-show="!valueForm.$visible" ng-click="valueForm.$show()">
                  Edit
                </button>
              </span>
            </div>
            <form editable-form name="valueForm" onaftersave="$ctrl.saveColumn('valueTranlate')" ng-show="valueForm.$visible">
              <button type="submit" ng-disabled="valueForm.$waiting" class="btn btn-primary">
                Save
              </button>
              <button type="button" ng-disabled="valueForm.$waiting" ng-click="valueForm.$cancel()" class="btn btn-default">
                Cancel
              </button>
            </form>
          </th>
...
<tr dir-paginate="v in my array>
...
</table>
  <dir-pagination-controls auto-hide="false" on-page-change="$ctrl.saveColumn()" boundary-links="true" max-size='7'></dir-pagination-controls>
...
my .js
saveColumn() {
        if (this.$scope.valueForm.$visible) {
          angular.forEach(this.langV, (value) => {
            this.$http.patch('/api/dict_values/' + value.v_id, {
              id: value.v_id,
              value: value.value2,
              user_id: this.currentUser()._id,
              key_id: value._id,
              lang_id: this.$scope.select2
            });
          });
          this.showLang(this.$scope.select1, this.$scope.select2);
        }
      }

所以调用saveColumn() 它会迭代每个页面上的所有字段并保存值,但不会保存其他页面的编辑,因为它们已“删除”。尝试在页面更改时调用save(),但值“删除”的速度比save() 快​​。

那么我怎样才能实现在每个页面上都可以编辑,并且如果我更改页面,值不会被遗忘?

【问题讨论】:

    标签: angularjs pagination local-storage angular-local-storage


    【解决方案1】:

    我通过添加一个“记住”所有编辑值的工厂解决了这个问题。
    我在我的 Textarea 中添加了一个 ng-change 以在每次发生某些事情时触发这个 Factory。

     <span editable-textarea="v.value2"  e-ng-change="$ctrl.remember(v,$data)" e-name="valueTranslate" e-form="valueForm" e-rows="3" e-cols="25" onbeforesave="$ctrl.checkName($data)">
                  {{v.value2 || '' }}
                </span>
    

    首先调用一个remember(v,$data)函数

          // Remember Edits for Pagination
        remember(obj, data) { //obj-> actual edited, data -> the input
    
            if (obj.close === undefined || obj.close === '' || obj.close === null) {
              obj.close = obj.value2;
            }// Attaching a Close property for the Case the User cancel the Edits
    
            obj.value2 = data;// saving the Edits in value2, this is which is get send to DB
    
            this.rememberValues.addValue(obj); // and send to Factory
          }
    

    然后将它保存在我的工厂中,这样编辑就不会被 ChangePange 删除

    .factory('rememberValues', () => {
      var valuesE = [];
      var savingValue;
      return {
        values: () => {
          return [].concat(valuesE);//for output and saving,contains all edited fields
        },
        addValue: (obj) => {//adding in Array
          savingValue = _.find(valuesE, function(value) {
            return value._id === obj._id;
          });
          if (savingValue) {
            savingValue.value2 = obj.value2;
          } else {
            valuesE.push(obj);
          }
        },
        clear: () => {//if I want to clear the Array
          angular.forEach(valuesE, (value) => {
            delete value.close;
          });
          valuesE = [];
        },
        cancel: () => {// The User Cancels the Edits
          angular.forEach(valuesE, (value) => {
            value.value2 = value.close;// Original Value is put in again
            delete value.close;
          });
          valuesE = [];
        }
      };
    })
    

    【讨论】:

      猜你喜欢
      • 2018-03-12
      • 2017-04-01
      • 1970-01-01
      • 2019-06-27
      • 1970-01-01
      • 1970-01-01
      • 2023-01-19
      • 2011-12-09
      • 2020-06-11
      相关资源
      最近更新 更多