Yahoo Answers is shutting down on May 4th, 2021 (Eastern Time) and beginning April 20th, 2021 (Eastern Time) the Yahoo Answers website will be in read-only mode. There will be no changes to other Yahoo properties or services, or your Yahoo account. You can find more information about the Yahoo Answers shutdown and how to download your data on this help page.

Populate a textarea using jquery?

Okay, not sure why this easy jquery is not working for me.

I have a textarea field (Text Box to fill) and a button (EvilButton). When the EvilButton is clicked I wanted it to populate the textarea field.

$(document).ready(function(){

var stupidField = $('textarea[title=Text Box to fill]');

var headerOP1 ='<div><b>So stupid</b></div>';

var headerOP2 ='<div><b>I know</b></div>';

$(stupidField).val(headerOP1);

$("#EvilButton").click(function(){

alert('hi');

$(stupidField).val(headerOP2);

});

});

Everything about this works except the headerOP2/"I know" does not get populated upon button click.

"So stupid" first appears when you open page, the alert works but $(stupidField).val(headerOP2); is not working, I've even tried using $(stupidField).val(headerOP1); which clearly works earlier but doesn't seem to work with the button click. *sigh*.

Update:

Updated...var stupidField = $('textarea[title="Text Box to fill"]');

still not working :(

Update 2:

Okay, so I added a alert($(stupidField).val()); after $(stupidField).val(headerOP2); and it's returning the right result...but it's not showing up in the textarea. Maybe a sharepoint thing?

2 Answers

Relevance
  • 7 years ago

    Your title query has spaces in it...try:

    var stupidField = $('textarea[title="Text Box to fill"]');

  • John
    Lv 7
    7 years ago

    try this...

    <!DOCTYPE html>

    <html>

    <head>

    <title>Javascript :: PopulateToTextArea </title>

    <script src="http:// code.jquery.com/ jquery-2.1.0.min.js" type="text/javascript"></script>

    <script type="text/javascript">

    $(function() {

    var field = $('textarea[title="Text Box to fill"]');

    var header1 = '<div><b>So stupid</b></div>';

    var header2 = '<div><b>I know</b></div>';

    field.text(header1);

    $('#evilButton').click(function(e) {

    e.preventDefault();

    alert('hi');

    field.text(header2);

    });

    });

    </script>

    </head>

    <body>

    <form>

    <textarea cols="50" rows="10" title="Text Box to fill"></textarea>

    <button id="evilButton">Evil Button</button>

    </form>

    </body>

    </html>

Still have questions? Get your answers by asking now.