Dumping textarea content into JS Alert?

Question

So, I have a form using TinyMCE editor and for debugging purposes I'd like to have the content of the textarea dumped into a simple JS alert box on submit:

<form method="post" action="somepage">
    <textarea name="content" style="width:50%"></textarea>
    <p>
    <input type="submit" value="Submit">
</form>

Do you have an idea how this can me achieved? Thanks a ton! G

please use `console.log()` and see your text in FireBug or Chromes Element Inspector — Kyslik, Sep 19 '13 at 21:18
@Kyslik Sometimes it's useful to use `alert()` instead of `console.log()`, especial in this case, when the value is needed just before submit... — Teemu, Sep 19 '13 at 21:23
seconded. Don't use alert, use the consonle, that's what it for. Unless you need to interrupt all execution on your page, with a throwaway label that you can't inspect, don't use `alert`. — Mike 'Pomax' Kamermans, Sep 19 '13 at 21:23
I use `alert()` while "crafting" the script so I know right away if something is calling something, but for debugging I strictly use `console.log()`, note that `console.log()` does not [work](http://stackoverflow.com/a/5473193/1564365) in IE 7- — Kyslik, Sep 19 '13 at 21:31

score 0 · Answer 1 · answered Sep 19 '13 at 21:23

Something along these lines in raw JavaScript. As others have said, console.log is really helpful for debugging - but if you want an alert...

var input = document.getElementsByTagName("input")[0];

input.addEventListener("click", 
                       function (event) {
                           event.preventDefault(); // Remove this to make the event actually go through.
                           var textBox = document.getElementsByName("content")[0];
                           alert(textBox.value);
                       }, 
                       false);

Demo

Thanks Eric - I tried this and if I add the script after the form I get an empty alert box.The same script added before the form gives me a: `code`TypeError: input is undefined input.addEventListener("click", — Gabriel Bucataru, Sep 20 '13 at 17:26

score 0 · Answer 2 · edited May 23 '17 at 12:28

<form method="post" action="#">
    <textarea name="content" class="textarea-test" style="width:50%"></textarea>
    <input type="submit" value="Submit">
    <br>
    <a href="#" class="test-link">click me</a>
</form>

$(document).on("click", "test-link", function () {
     console.log($(".textarea-test").val());
});

do not forget about loading jQuery

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

and also check out this answer.

Dumping textarea content into JS Alert?

2 Answers2