Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Angular.js submit form old way

I'm migrating an old html page from jQuery to Angular, and it contains some old-school forms with <input type="submit">. When I enriched my pages with the ng-app directive, the old forms stopped working (I mean when you press the submit buttons then nothing happens).

I searched for this problem and scanned the Angular docs too, but it seems that nobody is submitting forms anymore.

Any suggestions on how to bring those forms to life again without much keystrokes would be appreciated.

Currently the form has following markup:

<form name="form_upload" method="post" action="" enctype="multipart/form-data">
<input type="file" name="file">
<input type="submit" name="send" value="Upload">
</form>

All jQuery code I purged and starting fresh with Angular.

UPD:

I guess i now found cause, it's empty action attribute, it seems empty action is not welcomed by standarts, but very convenient to use allowing you to submit form to the current page URL, is there Angular way to do it ?

like image 496
Dfr Avatar asked Jun 05 '13 17:06

Dfr


2 Answers

Going off of the docs: http://docs.angularjs.org/api/ng.directive:form

Angular's philosophy is to minimize data and page reloads, so they don't like "old school forms", but you can get around it by using an action attribute in the form.

Angular is designed with single page applications in mind and avoiding full page reloads as that is going to take longer to do. By using the ngSubmit directive, you can define a function to send over the form data to the server and get a response back much quicker than a full page reload. Bytes instead of Kilobytes.

like image 139
Tim Withers Avatar answered Oct 13 '22 22:10

Tim Withers


  • Use a non-empty action attribute to make Angular submit the form
  • Fill action attribute with current location (using angular)

In your controller:

$scope.location = $window.location.href

In your HTML:

<form action="{{location}}">

See the plunkr demo.

like image 38
markmarijnissen Avatar answered Oct 13 '22 22:10

markmarijnissen