CODEWITHSUNDEEP
javascriptjqueryangularjs
Pedro Miguel Pimienta Morales
Pedro Miguel Pimienta Morales

Reputation: 453

How to post user and pass

I 'm slowly trying to migrate an application from jquery to angular , but I'm still a little confused when it comes to understand certain things.

HTML

<input type="text" name="usuario" id="usuariotxt"/>
<input type="password" name="pass" id="passwordtxt"/>

<div id="btn-login">Ingresar</div>

JS

$("#btn-login").on('click', function (event){

var user = $('#usuariotxt').val();
   var pass = $('#passwordtxt').val();  


   if (user === "" && pass === ""){

       //console.log('Debe escribir el Usuario y/o Contraseña');
       $('#mensaje-error').empty();
       var Solicitud = 'Debe escribir el Usuario y/o Contraseña';
       $('#mensaje-error').append(Solicitud);

   }else{

       //console.log(user, pass);

       var login= {
          Usuario : user,
          Password : pass
       };

       $.ajax({

          type: 'POST',
          url:  'url/api',
          data: login,
          datatype: 'json'

        }).done(function(data) {

               console.log(data);

        });

The way I do it forth above using jquery .

I would like to know how to take the written information on inputs . In some instances I have seen ng -model . I would like if the only way or what are other possible solutions that can be applied

Upvotes: 0

Views: 101

Answers (3)

Usman Khair
Usman Khair

Reputation: 21

you can post parameters using controller and service.have a short look on controller and service code.you have to add module for your app. 

    Module:
        var app;
    (function() {
        app = angular.module("ModuleName", []);
    })();

    Controller:
 var login= {
          Usuario : $scope.user,
          Password : $scope.pass
       };
        var promisePost = AppointmentService.post(login);
    promisePost.then(function(pl) {
            var ID = pl.data;
            if (ID < 1) {
                if (ID == -1) {
                    //Logic
                }
            }); Service:
        this.post = function(login) {
            var request = $http({
                    method: "Post",
                    url: "../Controller/ActionName/",
                    data: login
                }
            });
        return request;
    }

Upvotes: 0

Kais
Kais

Reputation: 2008

You can try this:

<input type="text" name="usuario" ng-model="formValue.name"/>
<input type="password" name="pass" id="passwordtxt" ng-model="formValue.password"/>

<div ng-click="submitForm()">Ingresar</div>

JS:

$scope.formValue={};
$scope.submitForm= function(){

//submitting data to server
$http.post('url/api',$scope.formValue)
  .success(function(data){
  console.log(data);
   $scope.formValue={};
})

}

Upvotes: 1

Anik Islam Abhi
Anik Islam Abhi

Reputation: 25352

Yes you have heard right.

To get data from input angular have ng-model which will bind in scope.

To handle click on button angular have ng-click

Like this

<input type="text" name="usuario" ng-model="usuariotxt"/>
<input type="password" name="pass" ng-model="passwordtxt"/>

<div id="btn-login" ng-click="login()">Ingresar</div>

JS

 $scope.login=function(){
    console.log($scope.usuariotxt);
    console.log($scope.passwordtxt);
 }

Upvotes: 2

Related Questions