TextArea text append

how to append text from a dropdown list to a textarea

by Musale Martin

HTML

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<div class="container">
<textarea class='form-control' placeholder="Write something..." id="message" name="message" size='20'></textarea>
   <fieldset class="form-group">
                                <div class="checkbox">
                                    <label for="deptList">
                                        <label for="departments" id="deptList">Select a department
                                            <small>use this in case you've set up your account to <a
                                                    href="#"> include a department</a> at the end
                                                of the text
                                            </small>
                                        </label>
                                        <input type="checkbox" value="" class="checkbox-inline" id="deptCheck">
                                        <select class="form-control" id="departments">
                                            <option>Dept. 1</option>
                                            <option>Dept. 2</option>
                                            <option>Dept. 3</option>
                                            <option>Dept. 4</option>
                                            <option>Dept. 5</option>
                                            <option>Dept. 6</option>
                                            <option>Dept. 7</option>
                                        </select>
                                    </label>
                                </div>

                            </fieldset>
</div>

JavaScript

$('#deptCheck').click(function () {

        var theMessage = $("#message").text();
        var theDepartment = $("#departments").find(":selected").text();

        if ($(this).is(":checked")) {

            console.log(theMessage+theDepartment);
            $("#message").val(theMessage + theDepartment);
        } else {
            alert('you have included department in your text, please remove it to avoid extra charges') //disable input
        }
    });