jQuery - Select option and return values

Question

I have the following form:

<div class="form-group">
    <label for="sms_mensagem" class="col-sm-2 control-label">Mensagem Pré Definida</label>
    <div class="col-sm-10">
        <select class="selectpicker" id="men_cod" name="men_cod">
            <option value="">Selecione uma Mensagem</option>
            <? foreach($mensagens as $valor){ ?>
            <option value="<? echo $valor->men_cod; ?>"><? echo $valor->men_titulo; ?></option>
            <? } ?>
        </select>                                                   
    </div>
</div>                                          

<div class="form-group">
    <label for="sms_mensagem" class="col-sm-2 control-label">Mensagem</label>
    <div class="col-sm-10">
        <textarea class="form-control" id="sms_mensagem" name="sms_mensagem" rows="5"></textarea>
        <small class="caracteres">160 caracteres restantes.</small>
    </div>
</div>  

In the first select, I have predefined messages, which are searched through a jQuery in the database. The moment I select one of the messages, it brings the result in the sms_message field, until then OK, running 100%.

However, if I again select another message, it does not load the message, or if I select with null value, and then again select a predefined message, there is no return. What could be?

Follow the jQuery:

$(function(){
    $(document).on("change", function() {
        if(($("#men_cod").val())==''){
            $("#sms_mensagem").attr("disabled",false); 
            $("#sms_mensagem").val(''); 
        } else {
            $("#sms_mensagem").attr("disabled","disabled"); 
            var men_cod = $("#men_cod").val();
            var url = '<? echo base_url("index.php/sms/busca_mensagem"); ?>/'+men_cod;
            $.get(url, function(dataReturn){
                $('#sms_mensagem').load(url);
            });         
        }
    });           
});  

Answer 1

You must provide a selector for the "on" function:

$(function(){
    $(document).on('change', 'select', function() {
        if(($("#men_cod").val())==''){
            $("#sms_mensagem").attr("disabled",false); 
            $("#sms_mensagem").val(''); 
        } else {
            $("#sms_mensagem").attr("disabled","disabled"); 
            var men_cod = $("#men_cod").val();
            var url = '<? echo base_url("index.php/sms/busca_mensagem"); ?>/'+men_cod;
            $.get(url, function(dataReturn){
                $('#sms_mensagem').load(url);
            });         
        }
    });           
});

In this case, it will work as expected. Also, it is better to specify some element instead of "Document".

Answer 2

$(function(){
    $(document).on("change", function() {
        if(($("#men_cod").val())==''){
            $("#sms_mensagem").attr("disabled",false); 
            $("#sms_mensagem").val(''); 
        } else {
            $("#sms_mensagem").attr("disabled","disabled"); 
            var men_cod = $("#men_cod").val();
            var url = '<? echo base_url("index.php/sms/busca_mensagem");     ?>/'+men_cod;
            $.get(url, function(dataReturn){
                $('#sms_mensagem').html(dataReturn);
            });         
        }
    });           
});