jquery - Is there a way to get my code to do the same but with ng-show/hide? -
i have small snippet of code, works way want to, can't find anywhere how same effect use of angular instead of jquery. ideally use ng-show or ng-hide.so far haven't been able find solution, , tutorials find vague or didn't explain things need.
<!doctype html> <html ng-app> <head> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"> </script> <script src="testjs.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"> </script> <script> $(document).ready(function(){ $("#show").click(function(){ $("#div1").show(1000); }); }); $(document).ready(function(){ $("#hide").click(function(){ $("#div1").hide(1000); }); }); </script> </head> <body> <h3> want print on shirt? </h3> <input id="show" class="xd" type="checkbox">yes</input> <input id="hide" class="xd" type="checkbox">no</input> <script> $('input.xd').on('change', function() { $('input.xd').not(this).prop('checked', false); }); </script> <style> #div1 { display: none; } </style> <div id="div1"> <div> first name: <input type="text" maxlength="10" data-ng-model="firstname"/> {{ firstname }} <br /> last name: <input type="text" maxlength="10" ng-model="lastname" /> {{ lastname }} <br /> number: <input type="text" maxlength="3" ng-model="number"/> {{ number }} </div> </div> </body> </html>' and
function showme (box) { var chboxs = document.getelementsbyname("c1"); var vis = "none"; for(var i=0;i<chboxs.length;i++) { if(chboxs[i].checked){ vis = "block"; break; } } document.getelementbyid(box).style.display = vis; }
Comments
Post a Comment