Filling in a text input when changing a selection option

Question

Filling in a text input when changing a selection option

Navigation

#1 by (0 votes)

1

I have a question about how to fill in a text input when I change the option in a select, I do this because I want that when I select the patient's name I fill in an input with his phone number, I'm working with codeiniter, bootstrap modals and AJAX, I have tried with the change event of the select but I do not fill the imput with the option of select, I show you how my code is:

select (bootstrap selecpicker):

<div class="col-md-6 col-sm-12">
     <label>Paciente</label>
     <select class="form-control dropup show-tick" data-live-search="true" id="slc_cliente" style="width: 100%;" title="Selecciona un Paciente" data-width="100%" data-size="3" data-header="Buscar Paciente" data-style="btn-light">
     </select>
</div>

the input where I want the phone to be displayed:

<div class="col-md-6 col-sm-12">
    <label>Telefono</label>
    <div class="input-group">
        <input type="text" class="form-control" id="txttelefono" disabled>
            <span class="input-group-addon">
                <span class="fa fa-phone"></span>
            </span>
     </div>
</div>

the AJAX of donte I obtain all the information of the patients (id, name, surnames and telephone):

$.post(baseurl + "cCalendar/getClientes",
function (data) {
    var clientes = JSON.parse(data);
    $.each(clientes, function (i, item) {
        $('#slc_cliente').append('<option data-icon="fa fa-user" value="' + item.id_cliente + '">' + item.cliente + '</option>');
    });
});

Any ideas on how to do? I'm a super novice with Jquery and Javascript ... Is it the best way to do it or do you suggest another one?

Greetings and thanks for your help in advance.

javascript jquery php ajax codeigniter

asked by Josh Rodríguez 28.12.2018 в 01:58

source

1 answer

Fill a DropDownList depending on a conditional query in asp.net mvc 5 entity framework check if there is a record - in a table (EN LARAVEL)

score 0 · Accepted Answer

I found an unorthodox solution but it works for me so I leave it here, as well as I obtained the client's data (id, names, surnames, etc), I also made a function in the controller and in the model to obtain only the tenephone, leave it like this at the end, in case someone is helpful:

script in the view.php:

$(document).ready(function() {
    $('#slc_cliente').change(function() {
        IdTEL();
        InfoTEL(TelefonoCliente);
    });
});

function IdTEL() {
    TelefonoCliente = {
        idc: $("#slc_cliente").val()
    };
}

function InfoTEL(TelefonoCliente) {
    $.ajax({
        type: 'POST',
        url: '<?php echo base_url(); ?>cCalendar/getTelefonos',
        data: TelefonoCliente,
        success: function(data) {
            var clientes = JSON.parse(data);
            $.each(clientes, function(i, item) {
                $('#txttelefono').val(item.telefono);
            });
        },
        error: function() {
            alert('Hay un Error!!!');
        }
    });
}

controller.php:

public function getTelefonos()
{
    $idc = $this->input->post('idc');

    $r = $this->Mcalendar->getTelefonos($idc);

    echo json_encode($r);
}

modelo.php:

public function getTelefonos($idc)
{
    $this->db->select(c.id_cliente, c.telefono);
    $this->db->from('t_clientes c');
    $this->db->where('c.id_cliente', $idc);

    $param = $this->db->get();
    return $param->result();
}

If there is a better way, I am open to suggestions, but in this way it works perfectly, greetings and happy holidays.