CODEWITHSUNDEEP
javascripthtmlangularjs
shubhamagiwal92
shubhamagiwal92

Reputation: 1432

How to Handle Forms present in the Single HTML Page

My Doubt is as follows I have a static HTML Page(Login.html) with 3 forms in it namely

  1. Login Form
  2. Create Account Form
  3. Forgot Password Form

When the user Types in my correct user email Id an password in the LOGIN Form, the form needs to direct it to a different HTML page namely dashboard.html. When the user Selects forgot Password form, the form will ask the user to enter his email ID and once the user clicks on Submit button the forgot Password Form should redirect it to Login Form in the Login.html file. Both the Forms are in the Single Html Page.

My Question is that How do I redirect from One form to another form in a Single HTML page using Angular JS and Also from one page to another page in Angular JS. I couldn't Find good tutorials on this Issue. So can somebody help me with this issue.

Upvotes: 0

Views: 68

Answers (1)

Rich Miller
Rich Miller

Reputation: 810

If you need to redirect between forms in a single-page html application, you will need to use routing. Your choices are ngRoute which is a part of AngularJS but a separate module, and ui-router from the AngularUI folks, which I would recommend.

I assume you are handling your login form submission using the ngSubmit directive on the form? If so, check the username/password by whatever means you need to in the scope function assigned to ngSubmit. If the credentials are valid, use the router or the $location service to redirect the user to the dashboard. The link to the forgot password page is a simple link with an ngHref or ui-href, depending on the router you are using.

Your HTML pages will be displayed in the section of the page set aside for views (again, check which router you are using). The HTML pages should be partial pages, not full HTML pages, since they are going to be inserted in the main page of your single page application.

Hope that helps.

Upvotes: 1

Related Questions