Create popup with alert in AngularJS and JavaScript

Question

I am working on a project and want to have an alert box pop up when the user clicks on the input section. However, I am having issues. Any suggestions?

My html/AngularJS code:

<li ng-click="showCustomerList()" class="clickable">
    <label>Customer Info</label>
    <input readonly = "readonly" ng-class = "{editing: ShowCustomerList.isOpen()}" placeholder = "text" value = "{{getCustomerName}}"/>
</li>

My JavaScript/AngularJS code:

$scope.showCustomerList = function () {
    alert("This is the popup!");
};

Answer 1

I guess you are missing the ng-app directive or putting it inside the head tag. Try putting it inside the html tag or the body tag.

HTML :

<body ng-app="TestApp">
    <div  ng-controller="MyController">   
        <ul>
            <li ng-click="alertMe()"  class="clickable">Click me</li>
        </ul>
    </div>
</body>

myjs.js

var myModule = angular.module("TestApp", []);
myModule.controller("MyController", function($scope){
    $scope.alertMe = function(){
        alert("Hello Everyone");
    };
});

jsFiddle

Answer 2

It should work fine. Take a look here .

Answer 3

Try adding an ng-click directive to an anchor element:

<input readonly="readonly" ng-class="{editing: ShowCustomerList.isOpen()}" placeholder="text" value="{{getCustomerName}}"/>

<a href="" ng-click="showCustomerList()">Click Me</a>

Create popup with alert in AngularJS and JavaScript

Question

3 answers

solution1
3 ACCPTED 2014-06-09 21:11:00

solution2
1 2014-06-09 20:41:01

solution3
0 2014-06-09 20:38:03

Create popup with alert in AngularJS and JavaScript

Question

3 answers

solution1 3 ACCPTED 2014-06-09 21:11:00

solution2 1 2014-06-09 20:41:01

solution3 0 2014-06-09 20:38:03

solution1
3 ACCPTED 2014-06-09 21:11:00

solution2
1 2014-06-09 20:41:01

solution3
0 2014-06-09 20:38:03