根据所选选项更改输入内容

Question

I am facing a little problem. Here is my code (a simple form) :

<form id="form-mission" method="post" action="mission.php">
    <ul>
    <li class="except">
    <select name="membre">
        <option value=0> Lucy </option>
        <option value=1> John </option>
        <option value=3> Peter </option></select>
    </li>

    <!--Content-->
    <li><textarea name="texte" id="text_area" ></textarea></li>

    <!-- Submit -->
    <li class="except"><input type="submit" value="Submit" /></li>
    </ul>

</form>

I would like to set the textarea text depending on which name is selected but before we submit the form. In fact, when the option is changed, i want the content of the textarea also changed.

Could you help me please ? Thanks !

Answer 1

your jquery

$('select[name="membre"]').on('change',function(){
    alert($('select option:selected').text());
    var get=$('select option:selected').text();
    $('#text_area').val(get);
});

DEMO

or you can add id to your dropdown and fire event on the basis of id so your dropdown would be like this

<select name="membre" id="ddlMember">
        <option value=0> Lucy </option>
        <option value=1> John </option>
        <option value=3> Peter </option></select>

and your jquery would be

$('#ddlMember').on('change',function(){
    var get=$('select option:selected').text();
    document.getElementById('text_area').value=get;
});