AngularJs clear form in Modal and set it ng-invalid

Question

i have a small problem with Angular JS and modal bootstrap.

This is the scenery: I create a modal with bootstrap which contain a form. In this form i use angular validation with the built-in property formname.$valid. When formname.$valid is false i set a submit-button to Hidden, when formname.$valid is true the same button is visible.

The problem is when i submit the first time the form closing the modal and clear all the input type. The second time i open the modal the property formname.$valid is true, instead it has to bee false. Also the class of the form is set to ng-valid, however it has to be ng-invalid. How can i resolve this problem?

This is a jsfiddle demonstration which explains exactly my issue.

For the js fiddle project i reccomend you to use Chrome, because is the only browser i need to support (it's only a school project)

Thanks to all!

(sorry for my bad english)

Answer 1

You need to visit documentation for ui-bootstrap

Documentation ui-bootstrap

You include ui-bootstrap in your module and you don't use it for manage your modal

Look at this plunker for use $modal:

Example modal angularjs