当前位置: 动力学知识库 > 问答 > 编程问答 >

In AngularJS, how can I prevent a nested <button> from submitting the form that it's in?

问题描述:

I have a form (done in AngularJS) for entering records into a movie database. Within the form I have a dropdown of actors which the user can select from to add to the movie record that they are in the middle of creating. When the user clicks the button next to the dropdown to add the actor to the movie, it submits the entire form. I could, of course, take the easy way and use a div instead a but I feel that I shouldn't have to work around this like that. Is there a standard of way of dealing with this?

网友答案:

In these situations, as buttons in default are type="submit", Just set type="button" on all buttons that you do not want them to submit the form. That would do the trick for you.

网友答案:

You can handle the click using ng-click.

In the Dom:

<button ng-click="handleClick()">I love Polka Dot Bow Ties.</button>

In the Controller:

$scope.handleClick= function handleClickFn($event) {
  $event.stopPropagation();

} 

Stopping the propagation of the event, prevents the event from bubbling up to its parent elements and triggering your submit.

分享给朋友:
您可能感兴趣的文章:
随机阅读: