"Javascript call"
Bootstrap 3.0.0 Snippet by Nirmaan

Post to Facebook Tweet this

<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <html> <head> <meta charset="ISO-8859-1"> <title>Form Generator</title> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> <script src="script.js"></script> </head> <body ng-app="mymodule" ng-controller="mycontroller"> <br><br> <div class="container-fluid"> <div class="row"> <div class="col-md-2"> <div id="toolbox" style="border: 2px solid red;" align="center"><p></p> <input type="submit" value="Text" data-toggle="modal" data-target="#myModal"> <br><br> <input type="submit" value="Multiple Radio" data-toggle="modal" data-target="#radioModal"> <br><br> </div> </div> <!-- Modal --> <div class="modal fade" id="myModal" role="dialog"> <div class="modal-dialog"> <!-- Modal content--> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">×</button> <h4 class="modal-title">Modal Header</h4> </div> <form name="myform" > <div ng-app="" class="modal-body"> Label name:<input type="text" placeholder="Enter label name" ng-model="name" required/><p></p> </div> <div class="modal-footer"> <button type="button" class="btn btn-warning" data-dismiss="modal" ng-model="text" ng-click="text = true">Submit</button> </div> </form> </div> </div> </div> <!-- Radio Modal --> <div class="modal fade" id="radioModal" role="dialog"> <div class="modal-dialog"> <!-- Modal content--> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">×</button> <h4 class="modal-title">Modal Header</h4> </div> <div class="form-group"> <form class="form-horizontal" name="myform" > <div ng-app="" ng-init="" class="modal-body"> Label name: <input type="text" placeholder="Enter label name" ng-model="labelName" required/><p></p> Values: <input type="text" placeholder="Enter label name" ng-model="noOfValues" required/><input type="button" ng-model="addText" ng-click="addText = true" value="+"/><p></p> <input type="text" ng-if="addText"/> </div> <div class="modal-footer"> <button type="button" class="btn btn-warning" data-dismiss="modal" ng-model="text" ng-click="text = true">Submit</button> </div> </form> </div> </div> </div> </div> <div class="col-md-10" style="border:2px solid black;"> <p></p> <div ng-if="text" > {{name}} <input type="text" > <br><br> </div> <div ng-if="radio"> <input type="radio" value="Male" >Male<br/> <input type="radio" value="Male" >Male<br/> <input type="radio" value="Male" >Male<br/> <br><br> </div> </div> </div> </div> </body> </html> <script type="text/javascript"> window.onload = function() { if(document.getElementById('number1').checked) { var h1 = document.createElement("h1"); h1.appendChild(document.createTextNode("Hello member")); document.getElementById("XXX").appendChild(h1); } } </script> <script type="text/javascript"> var myApp = angular.module('myApp', []); myApp.factory('myService', function() { return { foo: function() { alert("I'm foo!"); } }; }); myApp.controller('MainCtrl', ['$scope', 'myService', function($scope, myService) { $scope.callFoo = function() { myService.foo(); } }]); </script> <!-- <body ng-controller="MainCtrl"> <button ng-click="callFoo()">Call foo</button> -->
var app = angular.module("mymodule",[]).controller("mycontroller",function($scope){ });

Related: See More

Paper Kit 2 Angular
Callouts - Call to Action
Call to action with dark background
Call to Action

Questions / Comments: