Angular binding issue

Question

I have a form :

  <div class="col-xs-12 col-sm-6" ng-controller="registerController">
    <form id="registerForm" name="registerForm" style="box-shadow: rgba(0, 0, 0, 0.17) 0px 5px 13px; margin:25px; direction:rtl" class="contact-form-box" novalidate>

        <div class="account_creation">
            <h3 class="page-subheading">Your personal information</h3>
            <div class="required form-group">
                <label class="control-label col-sm-4" for="email">Email </label>
                <div class="col-sm-6 form-ok">
                    <input class="form-control"  type="text" id="Email" name="Email" ng-model="model.Email" value="" />
                </div>
            </div>
            <div class="required password form-group">
                <label class="control-label col-sm-4" for="passwd">Password </label>
                <div class="col-sm-6 form-error">
                    @*<input class="form-control" type="password" id="Password" name="Password" ng-model="model.Password" value="" />*@
                    <input class="form-control" type="password" id="Password" name="Password" ng-model="model.Password" value="" required />
                    <span class="form_info">(Five characters minimum)</span>
                </div>
            </div>

        </div>

        <div class="submit clearfix">

            <button type="submit" name="submitAccount" id="submitAccount" class="btn btn-outline button button-medium" ng-click="register()">
                <span>register</span>
            </button>
            <label style="color:#808080;font-size:16px" ng-if="message" ng-model="message">{{message}}</label>

        </div>
    </form>
</div>

and in script i have :

<script>
       app.cp.register('registerController', function ($http, $scope) {
    $scope.register = function () {
        $scope.model = {};
        $scope.model.Email = $scope.Email == undefined ? "" : $scope.Email;
        $scope.model.Password = $scope.Password == undefined ? "" : $scope.Password;
        debugger;
        $http.post("/Account/Register", $scope.model).success(function (response) {
            $scope.message = response;
        });
     }
  });
 </script>

I want post some value to a method in controller, but when i write some thing in both of inputs Email and Password, i got $scope.Email and $scope.Password undefined in regiterController(instead of what i wrote before in the inputs) !!! what is the problem?

Lee · Accepted Answer · 2015-11-02 16:15:27Z

2

You are assigning to $scope.model.Email instead of $scope.Email and the same for the password field.

Also, you shouldn't be assigning to the model inside your register function, you'll override the $scope.model every time you submit.

edited Nov 2, 2015 at 16:15

answered Nov 2, 2015 at 16:09

Lee

3,1213 gold badges25 silver badges29 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular binding issue

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related