Enable text box while perform events in angularjs

Question

I am using ng-repeat to printing data.here i added one replay button.based on reply button enable text box under replay button.

but when i click replay button text boxes are enable all the replay buttons.

Thank you...!

Controller Code

getForumOnIdAnswer(fAnsId);
        function getForumOnIdAnswer (fAnsId){
            ForumRepository.getForumOnIdAnswer(fAnsId)
            .then(function (response){
                scope.forumAnswer=response;
            },
             function(errResponse){
                 console.error('Error while fetching forumAnser');
             }
            );
        };

html code

<div ng-repeat="forumAnswerData in forumAnswer">
                    <div class="panel-group">
                        <div class="panel panel-success">
                            <div class="panel-heading">
                                <a href="">{{forumAnswerData.farmer.firstName}}</a>
                                <div class="pull-right">{{ forumAnswerData.answerDate |
                                    date:"MM/dd/yyyy 'at' h:mma" }}</div>
                            </div>
                            <div class="panel-body">{{forumAnswerData.answer}}</div>
                            <div class="panel-footer">
                                <button type="button" class="btn btn-danger" ng-click="">Reply</button>
                            </div>
                        </div>
                    </div>
                </div>

i belive, your are usina var out from object repeated, try to create a var in same object repeated as the button,please share your code and will help you better — Álvaro Touzón
– Álvaro Touzón, Commented Jun 13, 2017 at 5:48
@ÁlvaroTouzón i'm using ng-repeat.here how to enable text box clicking button — Umapathi
– Umapathi, Commented Jun 13, 2017 at 5:57

Hadi · Accepted Answer · 2017-06-13 06:02:56Z

2

It should be like this. just for enabling textbox.

<div ng-repeat="forumAnswerData in forumAnswer">
  <div class="panel-group">
    <div class="panel panel-success">
      <div class="panel-heading">
        <a href="">{{forumAnswerData.farmer.firstName}}</a>
        <div class="pull-right">{{ forumAnswerData.answerDate | date:"MM/dd/yyyy 'at' h:mma" }}</div>
      </div>
      <div class="panel-body">{{forumAnswerData.answer}}</div>
      <div class="panel-footer">
        <textarea ng-model="yourModel" ng-show="$index ==currentTextBox"></textarea>
        <button type="button" class="btn btn-danger" ng-click="currentTextBox = $index">Reply</button>
      </div>
    </div>
  </div>
</div>

answered Jun 13, 2017 at 6:02

Hadi

17.3k4 gold badges41 silver badges63 bronze badges

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

1 Comment

Umapathi Over a year ago

under replay button.like stack overflow add comment

Álvaro Touzón · Accepted Answer · 2017-06-13 06:03:20Z

0

the code i think will work, using your own repeater in view is:

<div ng-repeat="forumAnswerData in forumAnswer" ng-init="forumAnswerData.buttonEnabled=false;">
                    <div class="panel-group" ng-click="forumAnswerData.buttonEnabled=true">
                        <div class="panel panel-success">
                            <div class="panel-heading">
                                <a href="">{{forumAnswerData.farmer.firstName}}</a>
                                <div class="pull-right">{{ forumAnswerData.answerDate |
                                    date:"MM/dd/yyyy 'at' h:mma" }}</div>
                            </div>
                            <div class="panel-body">{{forumAnswerData.answer}}</div>
                            <div class="panel-footer">
                                <button type="button" class="btn btn-danger" ng-click="" ng-disabled="forumAnswerData.buttonEnabled">Reply</button>
                            </div>
                        </div>
                    </div>
                </div>

Expect it helps you

answered Jun 13, 2017 at 6:03

Álvaro Touzón

1,2301 gold badge8 silver badges21 bronze badges

2 Comments

Umapathi Over a year ago

the view is working and when i click button is disabled.but text box not displayed

Umapathi Over a year ago

I'm asking text box enable when i click button.but here button is disabled.can you add some more code for text box.

Collectives™ on Stack Overflow

Enable text box while perform events in angularjs

2 Answers 2

1 Comment

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related