Skip to content

Instantly share code, notes, and snippets.

@karkranikhil
Last active August 29, 2015 14:24
Show Gist options
  • Select an option

  • Save karkranikhil/9f64174f3ec180e024b2 to your computer and use it in GitHub Desktop.

Select an option

Save karkranikhil/9f64174f3ec180e024b2 to your computer and use it in GitHub Desktop.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html ng-app="helloApp">
<head>
<title>Email Notification</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.2/angular.min.js"></script>
<script>
var helloApp = angular.module("helloApp", []);
helloApp.controller("CompanyCtrl", function($scope) {
$scope.companies = [
{ 'email':'abc@xyz.com','Notify':[
{"value":'All'},
{"value":'Collection Initiate'}
]
},
{ 'email':'xyza@abc.com','Notify':[
{"value":'Collection Initiate'}
]
},
{ 'email':'qwe@rty.com','Notify':[
{"value":'Collection Failed'}
]
},
];
$scope.datas=[
{'Notify':'All'},
{'Notify':'Collection Initiate'},
{'Notify':'No Data Found'},
{'Notify':'Collection Failed'},
{'Notify':'Collection Success'}
];
// $scope.myData = $scope.datas[0];
$scope.addRow = function(){
var arr = [];
$.each($scope.myData, function(k,v){
//alert(arr.length);
arr[arr.length] = {"value" : v.Notify};
});
//alert(arr);
var check = 0;
$.each($scope.companies, function(k, v) {
if(v.email === $scope.email){
check = 1;
}
});
if(check === 0){
if(arr.length === 0){
alert("atleast select one notification option");
}else{
$scope.companies.push({ 'email':$scope.email, 'Notify':arr});
$scope.email='';
$scope.myData='';
}
}else{
alert("email alredy ecists in database");
}
};
$scope.addValue = function(value,i, currentObject){
var check = 0;
var arr= [];
arr[arr.length] = {"value" : value};
//alert(JSON.stringify(currentObject)+" "+JSON.stringify(arr));
$.each(currentObject, function(k,v){
alert(value + " " + v.value)
if(value === v.value){
check = 1;
alert(JSON.stringify(v.value));
}
})
alert("check = " + check);
if(check === 0){
currentObject[currentObject.length] = arr[0];
}else{
alert("alredy there!! :P ");
}
};
$scope.removeRow = function(email){
var index = -1;
var comArr = eval( $scope.companies );
for( var i = 0; i < comArr.length; i++ ) {
if( comArr[i].email === email ) {
index = i;
break;
}
}
if( index === -1 ) {
alert( "Something gone wrong" );
}
$scope.companies.splice( index, 1 );
};
$scope.removeValue = function(notify, index){
//alert(JSON.stringify(notify));
notify.splice(index,1);
};
});
</script>
</head>
<!-- Controller name goes here -->
<body ng-controller="CompanyCtrl">
<div class="container">
<div>
<form class="class="form-inline"" role="form" ng-submit="addRow()">
<div class="form-group">
<label class="col-md-2 control-label" style="color:blue;font-weight: bold;">Email Id</label>
<div class="col-md-4">
<input type="email" class="form-control" name="email"
ng-model="email" />
</div>
</div>
<div class="form-group">
<div class="col-md-1">
<button type="submit" class="btn btn-primary " Style="border-radius:25px;">
<span class="glyphicon glyphicon-plus" aria-hidden="true"></span>
</button>
</div>
</div>
<div class="form-group">
<label class="col-md-2 control-label" style="color:blue;font-weight: bold;">Notify On</label>
<div class="col-md-3">
<select ng-model="myData" class="form-control" multiple ng-options="data.Notify for data in datas" style="height: 100px;"></select>
</div>
</div>
</form>
<div>
<br><br>
<br>
<br><br><br>
<br>
<br>
<div class="row" ng-repeat="(index,company) in companies" style=" height: 60px;">
<div class="col-sm-1"><button type="submit" class="btn btn-primary " Style="border-radius:25px;" ng-click="removeRow(company.email)">
<span class="glyphicon glyphicon-minus" aria-hidden="true" ng-click="removeRow(company.email)"></span></button>
</div>
<div class="col-sm-2" style="color:blue;font-weight: bold;"> Email ID to be notified</div>
<div class="col-sm-3"><input class="form-control" value="{{company.email}}"></input></div>
<div class="col-sm-2" style="color:blue;font-weight: bold;">Notify on</div>
<div class="col-sm-3">
<select class="form-control" >
<option ng-repeat="Notify in company.Notify">{{Notify.value}}</option></span>
</select>
<div class="modal fade" id="myModal{{index}}" role="dialog">
<div class="modal-dialog" style="margin-top: 200px; margin-left:611px;">
<div class="modal-content" style="width: 237px;">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal">&times;</button>
<h4 class="modal-title">Edit Notify On</h4>
</div>
<div class="modal-body" style="width: 237px;">
<table class="table table-bordered ">
<th>Remove</th>
<tr ng-repeat="Notify in company.Notify">
<td>
{{Notify.value}} <span class="glyphicon glyphicon-remove" style="float:right" ng-click="removeValue(company.Notify, $index)"></span>
</td>
</tr>
</table>
<hr>
<table class="table table-bordered ">
<th>Add</th>
<tr ng-repeat="data in datas">
<td>
{{data.Notify}} <span class="glyphicon glyphicon-plus" style="float:right" ng-click="addValue(data.Notify, $index, company.Notify)"></span>
</td>
</tr>
</table>
</div>
</div>
</div>
</div>
</div>
<div class="col-sm-1">
<span class="glyphicon glyphicon-edit" data-toggle="modal" data-target="#myModal{{index}}"></span>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment