Can't acquire HTML textarea input text using Angular

Question

I have an HTML file using a <textarea> whose input I want to acquire using an Angular controller. Relevant HTML code is as follows:

<div class="list">
  <textarea
    placeholder="Comments"
    id="feedback"
    ng-model="feedbackInput">
  </textarea>
</div>

Here is the relevant code for my Javascript controller, which I feel like is on the right track, but produces the output:

$scope.finishSummary = function(){
    $scope.feedbackInput = "";
    console.log( "Feedback text = " + JSON.stringify($scope.feedbackInput) );
}

which produces the output:

Feedback text= ""

I use a "console.log()" simply for debugging purposes, but I want to be able to see the actual input value from the <textarea>. I'm relatively new to coding in HTML and especially with using Angular, so excuse my inexperience with the matter. In the end I just want to check to see if there is no text in the <textarea>. Any suggestions with how to do this so I can inject the data input from <textarea> into Angular? Thanks!

Sajeetharan · Accepted Answer · 2016-10-18 02:20:01Z

4

You are resetting the value "", just remove that line,

$scope.finishSummary = function(){   
    console.log( "Feedback text = " + JSON.stringify($scope.feedbackInput) );
}

Also you are not calling the finishSummary() anywhere in your code, you can call it in ng-blur to see the changes of the variable

 <textarea
    placeholder="Comments"
    id="feedback"
    ng-blur="finishSummary()"
    ng-model="feedbackInput">
  </textarea>

DEMO

answered Oct 18, 2016 at 2:20

Sajeetharan

223k65 gold badges370 silver badges409 bronze badges

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

4 Comments

Zach Over a year ago

Or move the console.log above the line that resets it! :)

Justin Over a year ago

@Sajeetharan I forgot to mention I have a button that calls finishSummary(). But I made the change you suggested, and now I get "Feedback text = undefined". Any other suggestions?

Sajeetharan Over a year ago

@Justin probably you are doing something wrong, check the plunker plnkr.co/edit/gYk1TpBFz332SaaF1AkN?p=preview

Justin Over a year ago

@Sajeetharan Sorry for the delay. I would love to mark it as "answered", but it's still giving me "undefined" for some reason, even though I have almost exactly what you have in the Plunker.

Collectives™ on Stack Overflow

Can't acquire HTML textarea input text using Angular

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related