CODEWITHSUNDEEP
javascriptangularjshtml
RahulKasana
RahulKasana

Reputation: 29

controller's function won't work in angular js

The button code is

<div class="btn-group" align="center">
    <button ng-click="myFunction()" id="one" class='btn btn-primary btn1' >Save Entry</button>
    <button ng-click="close_window()" id="two" class='btn btn-primary btn2'>Exit</button>
</div>

The New controller is

var app=angular.module('userApp',[])
    app.ng-controller('userController', function($scope)){
        $scope.myFunction = function(){
            var change= document.getElementById("one")
            if (change.innerHTML == "Save Entry")
            {
                change.innerHTML = "Saved!";
            }
            else 
            {
                change.innerHTML = "Save Entry";
            }
            return
        }

        $scope.close_window = function() {
            if (confirm("Close Window?")) {
                window.close();
            }      
        }
    }

this below code was working fine if i didn't add any controller and just declared function's like 

function myFunction(){
    var change= document.getElementById("one")
    if (change.innerHTML == "Save Entry")
    {
        change.innerHTML = "Saved!";
    }
    else 
    {
        change.innerHTML = "Save Entry";
    }
}

function close_window() {
    if (confirm("Close Window?")) {
    close();
}

but when i add the controller the buttons would stop working. I tried every function definitions and answers on stack overflow but nothing seem to be working correctly. How do i get to button's work inside controller like they used to be working?

Upvotes: 0

Views: 50

Answers (1)

the_mishra
the_mishra

Reputation: 833

var app=angular.module('userApp',[])
    app.controller('userController', function($scope){
        $scope.myFunction = function(){
            var change= document.getElementById("one")
            if (change.innerHTML == "Save Entry")
            {
                change.innerHTML = "Saved!";
            }
            else 
            {
                change.innerHTML = "Save Entry";
            }
            return
        }

        $scope.close_window = function() {
            if (confirm("Close Window?")) {
                window.close();
            }      
        }
    });
<DOCTYPE html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
</head>
<body ng-app="userApp" ng-controller="userController">
<div class="btn-group" align="center">
    <button ng-click="myFunction()" id="one" class='btn btn-primary btn1' >Save Entry</button>
    <button ng-click="close_window()" id="two" class='btn btn-primary btn2'>Exit</button>
</div>
</body>

you are using app.ng-controller it should be app.controller.ng-controller is a directive, used to define controller in view.

app.controller('userController', function($scope){
    .......
})

Upvotes: 2

Related Questions