0

tengo un script de autocompletado ajax y estoy intentando fundir dos $(document).on('click' en uno para que al hacer un solo click se copien los dos a la vez en sus correspondientes campos pero no lo consigo es posible?

$(document).on('click', '.datalistdes', function(){
                $('#nombre1').val($(this).text());
                $('#Listdes').fadeOut();

        }).on('click', '.linkdata', function(){
                $('#nombre2').val($(this).text());
                $('#Listdes').fadeOut();

        });

<div class="form-group">
    {{ Form::text('nombre1', null, ['class' => 'from-control', 'id' => 'nombre1']) }}
</div>
<div class="form-group">
    {{ Form::text('nombre2', null, ['class' => 'from-control', 'id' => 'nombre2']) }}
</div>

Ahora mismo me funciona bien al hacer clic en uno me lo rellena y al hacer clic en el otro también pero lo que necesito es que se rellenen las dos con un solo clic.

4
  • Quieres disparar el mismo evento click para dos componentes diferentes?
    – Mario L
    Commented el 7 nov. 2018 a las 17:10
  • ¿Podrías añadir un ejemplo mínimo verificable? Sólo te falta un poco de HTML para que comprendamos bien tu duda Commented el 7 nov. 2018 a las 17:18
  • Si Mario L exactamente eso Commented el 7 nov. 2018 a las 17:24
  • Ahora mismo Pablo Lozano pero quieres decir el formulario ? Commented el 7 nov. 2018 a las 17:24

3 respuestas 3

0

Hice un ejemplo con dos botones usando tus clases, la idea es agregar una clase en comun que tengan los dos selectores y a esa clase en común asignarle el evento click y luego evaluar cual de los dos haz pinchado:

$(document).on('click', '.clase-en-comun', function(){

  if($(this).hasClass("datalistdes")){
    
    alert("Haz clikeado datalistdes y el selector que voy a instanciar es #nombredes");
    $('#nombredes').val($(this).text());
    
  }else if($(this).hasClass("linkdata")){
    
    alert("Haz clikeado linkdata y el selector que voy a instanciar es #linkdes")
    $('#linkdes').val($(this).text());
  
  }
  
  $('#Listdes').fadeOut();

});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<button class="datalistdes clase-en-comun">datalistdes</button>

<button class="linkdata clase-en-comun">linkdata</button>

7
  • Gracias por tu ayuda y tu tiempo David lo que quiero es enviar los 2 al hacer click en uno Commented el 7 nov. 2018 a las 17:29
  • como enviar? hacer un ajax? Commented el 7 nov. 2018 a las 21:58
  • si como enviar los dos datos a sus respectivos input en un solo clic con ajax Commented el 8 nov. 2018 a las 11:34
  • @LendyRodriguezSilva datalistdes y linkdata son datalist? Commented el 8 nov. 2018 a las 13:49
  • en realidad no son clases simplemente Commented el 8 nov. 2018 a las 15:11
0

Como alternativa a la solucion de David podrias hacer lo siguiente:

$(document).on('click', '.datalistdes, .linkdata', function(){
    // logica que coloca el text al input que deseas
    $('#Listdes').fadeOut();
});

La logica que selecciona al elemento y le coloca el text del input variaria dependiendo de como este armado el html.

JQuery Multiple selector

3
  • el problema es que necesito que lo inserte cada uno en su input Commented el 7 nov. 2018 a las 17:35
  • Podrias editar en tu pregunta para mostrar un ejemplo de el html que tienes?
    – cavpollo
    Commented el 7 nov. 2018 a las 17:38
  • Ya lo edite intente que se entienda un poco mejor disculpen Commented el 7 nov. 2018 a las 17:46
0

En base a la respuesta de cavpollo, podrías completarla de la siguiente forma:

$(document).on('click', '.datalistdes, .linkdata', function(){
    // logica que coloca el text al input que deseas

    if($(this).attr('class') == "linkdata"){
        $('#nombre2').val($(this).text());
                $('#Listdes').fadeOut();
    }else{
        $('#nombre1').val($(this).text());
                $('#Listdes').fadeOut();
    }

    //Para cargar el valor en los dos inputs
    /*
    $('#nombre2').val($(this).text());
    $('#Listdes').fadeOut();
    $('#nombre1').val($(this).text());
    $('#Listdes').fadeOut();*/
});

Puse las dos opciones, es decir, para cargar un input según donde se haya hecho el click y para cargar los dos inputs.

0

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.