Send value of an input type tex to a data list


Dear good afternoon:

Requesting your kind support, in php I have a input type text where the user enters a Social Reason and when clicking, same string enter it into a datalist inside a function in javascript.

I've seen the routine in both php and js , but I have not found a way to combine the information.

Try getting the input value

        var Prospecto = $("#txtProspect").val();

Subsequently, assign it as any other object to the datalist (when creating it, add name and id):


The result is that it applies it but it disables the previously filled list, it only leaves it as a text box with the value obtained.

I appreciate your kind time. Best regards

asked by Carlos Alberto Alcocer Juárez 27.12.2018 в 22:10

1 answer


Very good day:

Reviewing, I think it is not possible because the nature of the datalist is to store information within its arrangement, which was intended to appear as if it were self-completed. Choose a check and an input type text. The check to enable the drawer if it is required to add a new company name and through a modal entry and copy.

It looks like this:


<form class="form-horizontal" role="form">
<div class="col-lg-4">
<label>Nuevo Prospecto</label>
<div class="input-group">
<span class="input-group-addon">
<input type='checkbox' class='checkbox_class' value='' id='chkNewProspect' data-placement='bottom' data-toggle="modal" data-target="#exampleModal">
<input type='text' class='form-control' aria-label='123' style='height:35px' placeholder='Agregar' name='txtNewProspect' id='txtNewProspect' disabled>


<div class="modal fade" id="exampleModal" tabeindex="-1" role="dialog" aria-labelledby="exampleModal"        aria-hidden="true">
                                            <div class="modal-dialog" role="document">
                                                <div class="modal-content">
                                                    <div class="modal-header">
                                                        <h5 class="modal-title" id="exampleModalLabel">NUEVOS PROSPECTOS</h5>   
                                                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                            <span aria-hidden="true">&times;</span>
                                                    <div class="modal-body">
                                                            <div class="form-group">
                                                                <label for="recipient-name" class="col-form-label">RAZÓN SOCIAL COMPLETA:</label>
                                                                <input type="text" name="txtProspect" id="txtProspect" class="form-control" id="recipient-name">
                                                            <div class="modal-footer">
                                                                <button type="button" class="btn btn-success" name="btnLoadProspect" id="btnLoadProspect" data-dismiss="modal">AGREGAR</button>
                                                                <button type="button" class="btn btn-danger" data-dismiss="modal">CERRAR</button>   

This way, I bring the information and leave it ready to show on screen.

answered by 28.12.2018 в 17:35