angularjs ng-click is not being called

Question

I am trying to integrate angular js. My HTML code is following

    <!DOCTYPE html>
<!-- BEGIN HEAD -->
<script src="javascript/angular.min.js" type="text/javascript"></script> 
<head  ngapp="lcms">
<!-- BEGIN BODY -->
<body class="login" ng-controller="loginController">
    <!-- BEGIN LOGIN -->
    <div class="content">
        <!-- BEGIN LOGIN FORM -->
        <form class="login-form">
            <h3 class="form-title">Login to your account</h3>
            <div class="alert alert-error hide">
                <button class="close" data-dismiss="alert"></button>
                <span>Enter any username and password.</span>
            </div>
            <div class="form-group">
                <!--ie8, ie9 does not support html5 placeholder, so we just show field title for that-->
                <label class="control-label visible-ie8 visible-ie9">Username</label>
                <div class="input-icon">
                    <i class="icon-user"></i>
                    <input class="form-control placeholder-no-fix" type="text" autocomplete="off" placeholder="Username" name="username" ng-model="username"/>
                </div>
            </div>
            <div class="form-group">
                <label class="control-label visible-ie8 visible-ie9">Password</label>
                <div class="input-icon">
                    <i class="icon-lock"></i>
                    <input class="form-control placeholder-no-fix" type="password" autocomplete="off" placeholder="Password" name="password"  ng-model="password"/>
                </div>
            </div>
            <div class="form-actions">
                <label class="checkbox">
                <input type="checkbox" name="remember" value="1"/> Remember me
                </label>
                <!-- <button  class="btn green pull-right"  ng-click="loginButton()">
                Login <i class="m-icon-swapright m-icon-white"></i>
                </button> -->            
                 <input type="button" class="btn green pull-right" value="Save" ng-click='loginButton' />
            </div>

            <div class="forget-password">
                <h4>Forgot your password ?</h4>
                <p>
                    no worries, click <a href="javascript:;"  id="forget-password">here</a>
                    to reset your password.
                </p>
            </div>
        </form>
        <!-- END LOGIN FORM -->        
        <!-- BEGIN REGISTRATION FORM -->

    </div>
    <!-- END LOGIN -->
    <!-- BEGIN COPYRIGHT -->
    <div class="copyright">
        2014 &copy; Learner Content Management System
    </div>
    <!-- END COPYRIGHT -->
    <!-- BEGIN JAVASCRIPTS(Load javascripts at bottom, this will reduce page load time) -->
    <!-- BEGIN CORE PLUGINS -->   
    <!--[if lt IE 9]>
    <script src="assets/plugins/respond.min.js"></script>
    <script src="assets/plugins/excanvas.min.js"></script> 
    <![endif]-->   
    <script src="javascript/assets/plugins/jquery-1.10.2.min.js" type="text/javascript"></script>
    <script src="javascript/assets/plugins/jquery-migrate-1.2.1.min.js" type="text/javascript"></script>
    <script src="javascript/assets/plugins/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
    <script src="javascript/assets/plugins/bootstrap-hover-dropdown/twitter-bootstrap-hover-dropdown.min.js" type="text/javascript" ></script>
    <script src="javascript/assets/plugins/jquery-slimscroll/jquery.slimscroll.min.js" type="text/javascript"></script>
    <script src="javascript/assets/plugins/jquery.blockui.min.js" type="text/javascript"></script>  
    <script src="javascript/assets/plugins/jquery.cookie.min.js" type="text/javascript"></script>
    <script src="javascript/assets/plugins/uniform/jquery.uniform.min.js" type="text/javascript" ></script>
    <!-- END CORE PLUGINS -->
    <!-- BEGIN PAGE LEVEL PLUGINS -->
    <script src="javascript/assets/plugins/jquery-validation/dist/jquery.validate.min.js" type="text/javascript"></script>  
    <script type="text/javascript" src="javascript/assets/plugins/select2/select2.min.js"></script>     
    <!-- END PAGE LEVEL PLUGINS -->
    <!-- BEGIN PAGE LEVEL SCRIPTS -->
    <script src="javascript/assets/scripts/app.js" type="text/javascript"></script>
    <script src="javascript/assets/scripts/login.js" type="text/javascript"></script>

    <script src="javascript/angular.min.js" type="text/javascript"></script> 
    <script src="javascript/angularjs/ang-app.js" type="text/javascript"></script> 
    <script src="javascript/angularjs/ang-login.js" type="text/javascript"></script>
    <!-- END PAGE LEVEL SCRIPTS --> 
    <!-- END PAGE LEVEL SCRIPTS --> 
    <script>
        jQuery(document).ready(function() {     
          App.init();
          Login.init();


        });
    </script>
    <!-- END JAVASCRIPTS -->
</body>
<!-- END BODY -->
</html>

ng-app code is following

'use strict';
var as = angular.module('lcms', []);

ng-controller is following

myApp.controller('loginController', function($scope) {
    $scope.loginButton = function() {
        alert ("login");
    }

});

For some reason ng-click is not being called. There is error of this code being shown on browser debugger.

any reasons known.

Thilo · Accepted Answer · 2014-05-27 07:35:49Z

1

ng-click='loginButton'

should probably be

ng-click='loginButton()'

answered May 27, 2014 at 7:35

Thilo

264k107 gold badges527 silver badges674 bronze badges

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

2 Comments

Ammar Ali Over a year ago

I am using Jquery version 1.10.2, and AngularJS uses some internal version, is that may be a problem?

Ammar Ali Over a year ago

found the solution moved ng-app from <head > to <body> <body class="login" ng-app="lcms"> and moved controller to main contentdiv <div class="content" ng-controller="loginController" >

Collectives™ on Stack Overflow

angularjs ng-click is not being called

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related