Angular MaterialJS Dialog form with different save options

人盡茶涼 提交于 2019-12-06 15:13:32

问题


I'm trying to save form data in mdDialog but with options of (save and close) the dialog and (save) which will save the form data then open another dialog empty dialog without having to close and open the mdDialog again, the problem is how to call same SaveData function in same form for both save operations?

$scope.saveData = function (isValid) {
        if (isValid) {
          updateservice.postdata($scope.myformdata)
            .then(function (data) {
              $mdDialog.hide();
            });
      // error handling
        } 
      };

and in the template:

<md-dialog>
  <form name="form" ng-submit="saveData(form.$validform)" novalidate>
    <md-dialog-content>
      <div class="md-dialog-content">
        <div>
        </div>
        <table class="table display" border="1" span="1" name="newForm" novalidate role="form" ng-style="{ width: th.width }">
           </tr>
          <tr>
            <td><input type="text" class="form-control text-center" placeholder="required"  ng-required="true"></td>
            <td><input type="text" class="form-control text-center" placeholder="optional" ng-required="true"></td>
          </tr>
        </table>
      </div>
    </md-dialog-content>
    <md-dialog-actions layout="row">
      <md-progress-circular md-mode="indeterminate" md-diameter="20px" class="spinner"></md-progress-circular>
      <button type="button" class="btn btn-primary" ng-click="save()" >Save</button> 
      <button type="submit" class="btn btn-primar">Save and close</button> 
      <button type="button" class="btn btn-default" ng-click="cancel()" ng-disabled="loading">Cancel</button>
      </md-dialog-actions>
  </form>
</md-dialog>

I changed Save button with type button is not posting the formdata, and changing type to submit like save and close saves data then opens and closes the dialog.

here's codePen with my code:

https://codepen.io/anon/pen/ZqoYRx


回答1:


How about passing an argument like isSaveAndClose in the save function:

In HTML:

<button type="button" class="btn btn-primary" ng-click="save(false)" ng-show="!loading">Save</button> 
<button type="button" class="btn btn-primar" ng-click="save(true)">Save and close</button>

In JS:

$scope.save = function (isSaveAndClose) {
      saveData();
      if (isSaveAndClose)
        $mdDialog.hide().then(showCustomConfirm);
    };


来源:https://stackoverflow.com/questions/52882446/angular-materialjs-dialog-form-with-different-save-options

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!