jQuery/Ajax Login Form - Best Approach?
I need to build a login box that satisfies the following:
- Build this as a UI Component that can be used in multiple locations in your site
- Two instances of this component can exist on the same page
- You can use jQuery, HTML5 and CSS3
- Your site supports IE9+ and current versions of Safari, Chrome, Firefox
- Your site supports iOS6
- Login form submits username and password data using AJAX to: api.yoursite.com/login
- Both form fields must be entered (not empty), otherwise display an alert message.
- If login succeeds, display in the browser JS console the “succeeded” message.
- If login fails, display in the browser JS console the “failed” message.
Questions I have:
- Should I assume api.yoursite.com/login is part of the same domain? In my first attempt, I did the opposite and tried to submit the data using JSONP, which would NOT work.
- If I'm only able to use jQuery, HTML and CSS, how should I account for a server-side language? And how could I set something up locally on my machine for testing purposes? My previous attempts have been unsuccessful.
I'm getting down to the wire here and would greatly appreciate any pointers. Thanks!