Login Form


#1

hi guys

if i want to create a login page and i would to send the parameter entered by user to php server that in his side fetch in MySQL to verify the login (i use ionic 2 typescript ) i try many tutorials but doesn’t work
what i do :
1- create the login page
2- the php file is fully work

just what i want is how to do this in the side of typescript ???

Best Regards


#2

Hello @Gatewayapp

This is nothing specific to ionic 2, its basically how do you create a login page using angular 2? You first need to understand basics of angular 2 like component, providers etc. There is a very good tutorial that will cover all the basics of angular 2 using a sample application here. I would strongly recommend you to go through it first. However here is some sample code that can help you to achieve what you are looking at,

Template

<ion-list>

  <ion-item>
    <ion-label floating>Username</ion-label>
    <ion-input [(ngModel)]="username" type="text" value=""></ion-input>
  </ion-item>

  <ion-item>
    <ion-label floating>Password</ion-label>
    <ion-input [(ngModel)]="password"  type="password" value=""></ion-input>
  </ion-item>

</ion-list>

<div padding>
  <button primary block  (click)="login()">Sign In</button>
</div>

Component

@Component({
    templateUrl: 'build/pages/login/login.html',
    providers: [AuthenticationApi]
})
export class LoginPage {
    username::string;
    password:string;
    constructor(public nav: NavController, public platform: Platform, public http: Http, public authenticationApi: AuthenticationApi) {
    }

    login() {
        this.authenticationApi.login(this.userName, this.password).subscribe(
             data => {      
               //Navigate to home page              
                this.nav.setRoot(HomePage);
             }
          )
       }
    }

Please note that you need to create AuthenticationApi service to validate the user, from inside the service you should be calling your PHP end point that checks login.

Regards
Vijay


#3

first thank you for you kindest reply :slight_smile:
second i do this step befor but i am stuck with the last part [quote=“vijquick, post:2, topic:54445”]
Please note that you need to create AuthenticationApi service to validate the user, from inside the service you should be calling your PHP end point that checks login.
[/quote]

so you can help in this
thank you in advance


#4

Please look at this to understand how to make http requests from your angular 2 application. I would strongly recommend you to go through the full tutorial


#5

Thanks @vijquick for your reply.I have one confusion.If my login api response is true or success then how will i check set in ionic 2 that this user is logged in like wise in web applications we store users credentials in the session if the login in is successful.Is their is anything similar thing like session in ionic 2 in which i store the user credentials and also check them to before sending each request.

Thanks again.


#6

hi, can you show me your project login with php mysql please…
thank’s before
yogi


#7

To use like sessions in WEB apps I think you need to save it in local storage…