djangoangularapi

how to get angular form input value using django api?


Here is the Angular Login Form which sends data to the get(formData.value)

 <form class="form-horizontal" [formGroup]="formData" (ngSubmit)="get(formData.value)">
                <div class="card-body">
                    <div class="form-group row">
                        <label for="inputEmail3" class="col-sm-2 col-form-label">Email</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" id="inputEmail3" placeholder="Email" 
                            formControlName="user">
                        </div>
                    </div>
                    <div class="form-group row">
                        <label for="inputPassword3" class="col-sm-2 col-form-label">Password</label>
                        <div class="col-sm-10">
                            <input type="password" class="form-control" id="inputPassword3" 
                            placeholder="Password" 
                            formControlName="pwd">
                        </div>
                    </div>
                    <div class="form-group row">
                        <div class="offset-sm-2 col-sm-10">
                            <div class="form-check">
                                <input type="checkbox" class="form-check-input" id="exampleCheck2">
                                <label class="form-check-label" for="exampleCheck2">Remember me</label>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="card-footer">
                    <button type="submit" class="btn btn-info">Sign in</button>
                    <but

ton type="submit" class="btn btn-default float-right">Cancel</button>
                </div>

            </form>

Here is the .ts file

get(formData : any) {  
    this.userData.userLogin(formData).subscribe((response) => {
    console.log(response);
    },
    error => {
      console.log(JSON.stringify(error.json()));
    })

Here is the Angular service.ts file method

   userLogin(data: any){
    return this.http.post(this.loginUrl, data, {responseType: 'text'} ) 
   }

Here is the Django Login API Code

from django.views.decorators.csrf import csrf_exempt
@csrf_exempt
def login(request):
    try:
        response_data = {}
        if request.method == 'POST':
            return HttpResponse(request)  // {"user":"Umair","pwd":"12345"}(by returning the request it shows angular form input values)

            user = request.POST['user']
            pwd = request.POST['pwd']
            Emp = Employee.objects.filter(Emp_Name=user, Emp_Pwd=pwd).exists()
            if Emp is True:
                if 'UserName' not in request.session:
                    request.session['UserName'] = user
                response_data['response'] = "LOGIN SUCCESS!"
                response_data['IsLogin'] = "TRUE"
                return HttpResponse(json.dumps(response_data), content_type="application/json")
                return HttpResponseRedirect('Dashboard')
            else:
                response_data['response'] = "Invalid UserName Or Password!"
                response_data['IsLogin'] = "FALSE"
                return HttpResponse(json.dumps(response_data), content_type="application/json")
        else:
            response_data['response'] = "Request Method must be POST rather than GET"
            response_data['REQUIRED METHOD'] = "POST"
            return HttpResponse(json.dumps(response_data), content_type="application/json")
    except Exception as e:
        return HttpResponse("Error !" + str(e))

As you can see in the image given below The API returns angular form input values

how to get the POST form values and saved in these variables given below:

            user = request.POST['user']
            pwd = request.POST['pwd']

Here is the attached screenshot

enter image description here

Any Help would be appreciated and thanks in advance


Solution

  • finally i figured out the solution how to save form values into the variables that is coming from angular reactive forms using the django Login API

    Here is the code

    from django.views.decorators.csrf import csrf_exempt
    from rest_framework.parsers import JSONParser
    import requests
    @csrf_exempt
    def login(request):
        try:
            response_data = {}
           
            response = JSONParser().parse(request)
             //response = {user: 'Umair', pwd: '123'} // angular form values
            if request.method == 'POST':
                user = response['user']
                pwd = response['pwd']
                Emp = Employee.objects.filter(Emp_Name=user, Emp_Pwd=pwd).exists()
                if Emp is True:
                    response_data['response'] = "LOGIN SUCCESS!"
                    response_data['IsLogin'] = "TRUE"
    
                    return HttpResponse(json.dumps(response_data), content_type="application/json")
                else:
                    response_data['response'] = "Invalid UserName Or Password!"
                    response_data['IsLogin'] = "FALSE"
                    return HttpResponse(json.dumps(response_data), content_type="application/json")
               
    
        except Exception as e:
            return HttpResponse("Error !" + str(e))