jameskleeh / angular-confirm

Confirmation modal dialog for AngularJS
Apache License 2.0
150 stars 75 forks source link

By default it works for ngClick, but how to bind to ngSubmit? Any idea? #86

Closed saravp2016 closed 7 years ago

saravp2016 commented 7 years ago

Angular-Confirm plugin works like a charm for button with ngClick as expected. Is there a straightforward way to apply the same for ngSubmit?

For Example: 1) Default : <button ng-click="clear()" confirm="Are you sure?">Cancel</button> 2) Form Submission:

<form ng-submit="mySubFunc:">
     <button type="submit" confirm="Are you sure?">Save</button>
</form>

Here, for 1) Default confirm pop up will work as expected since it has ngClick(when clicked OK). But for 2) Form submission, although confirm dialog will popup, on click of OK, it will not submit form but just close the confirm dialog, is there a way to submit form on click of OK.

I need it urgently, any quick update is much appreciated. Thanks.

simison commented 7 years ago

It's possible to submit forms without pressing the button (e.g. by cmd/ctrl+enter in input field) so you shouldn't rely only confirming on that button's click.

Instead, inside mySubFunc you should confirm programmatically. At least Angular1 version offered programmatic API, I don't know about Angular2+ version.

Here's v1 way:

// Ask for confirmation
$confirm({
  title: 'Are you sure?',
  text: 'Huh?',
  ok: 'Continue',
  cancel: 'Cancel'
})
.then(function() {
  // Do something if user pressed "continue"
});
saravp2016 commented 7 years ago

@simison Thanks for your input.

I just made below 2 changes and it looks good with some testing. Since it's resolved am closing this issue.

<!--<form name="editForm" ng-submit="vm.saveForm()">--><!---ng-submit was removed since button click takes care-->
<form name="editForm" >
.
.
.
<!--<button type="submit"...> --><!-- type changed to button and ngclick added-->
<button type="button" ng-click="vm.saveForm()"...>