Display a table when click on a button using angularJS

Question

Hi i am working on a django powered project. I have a button in my html as follows:

<tr align="left"><b><span style="background-color:white;"><button>{{ k }}</button></span></b></tr>

Am planning to use angularJS to display a table below once the user click the button above. I have the cotrolller below as follows:

% block extrascript %}


    {{ngapp}}.controller("MyCtrl", function($scope, $resource) {

    });
{% endblock %}

Sorry for the less amount of angularjs. Am very much new to angularJS. Can I have some suggestions guys? Thanks in advance

How to use ng-click, ng-show in this scenario?

vellattukudy
– vellattukudy

2016-02-24 03:03:10 +00:00
Commented Feb 24, 2016 at 3:03 — vellattukudy
– vellattukudy, Commented Feb 24, 2016 at 3:03

Praveen · Accepted Answer · 2016-02-24 03:39:29Z

3

Try something this:

<table ng-show="show">

 </table>
 <button ng-click="show=!show">{{ k }}</button>


 app.controller('MainCtrl', function($scope) {
      $scope.show = false; // Hide it initially 

    });

edited Feb 24, 2016 at 3:39

answered Feb 24, 2016 at 3:13

Praveen

2,4193 gold badges26 silver badges31 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

vellattukudy Over a year ago

Yes Praveen. But how can I do ng-show or ng-hide inside that function?

vellattukudy Over a year ago

Thats exactly what I want Praveen. Actually my tables are under a for loop. So there will be multiple tables. As per your answer when I click the button all my tables are getting displayed once i click the button. I just want the specific table to be displayed. How do I prevent that?

Praveen Over a year ago

Then you must be having many buttons also right? So, You can bind different variables to each table and its corresponding button. like show1, show2, etc.

Collectives™ on Stack Overflow

Display a table when click on a button using angularJS

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related