CODEWITHSUNDEEP
javascriptphpjqueryhtml
rocketer
rocketer

Reputation: 1071

Change content of input depending on selected option

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 !

Upvotes: 2

Views: 3019

Answers (4)

Amit Kumar
Amit Kumar

Reputation: 5962

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;
});

Upvotes: 4

Bhushan Kawadkar
Bhushan Kawadkar

Reputation: 28523

try this :

$(document).ready(function(){
  $('select[name="membre"]').change(function(){
      var text = $(this).find('option:selected').text();
      $('#text_area').html(text );
  });
});

Upvotes: 1

Yogesh Sharma
Yogesh Sharma

Reputation: 2017

You can use below js code

$('.test').change(function(){

$('#text_area').val($(".test option:selected").text());

});

Demo

Upvotes: 3

Anjith K P
Anjith K P

Reputation: 2158

$('[name="membre"]').on('change', function(){
    $('[name="texte"]').val($(this).find(":selected").text());
})

Upvotes: 2

Related Questions