1

¿Cómo puedo hacer en un condicional lo siguiente?

                 $(function () {

                     $("[id*='_btnCheck']").click(function () {



                         var buttonName = $(this).attr('id');
                         ChannelEvent(buttonName);
                     });

                     $("[id*='_btnRuta']").click(function () {
                         var buttonRuta = $(this).attr('id');
                         RouteEvent(buttonRuta);
                     });



                 });

Si hago clic en algún botón que lleve en el id _btnCheck entonces pase algo, si hago clic en algún botón que lleve en el id _btnRuta entonces pase algo, y por último si hago clic en algún botón que lleve id _btnCliente entonces que pase algo.

Mi código es funcional, pero me he quedado con esta pequeña limitante.

Actualización:

Me explicaré mejor digamos que tengo 10 de botones y estos son del grupo A, otros 10 botones son del grupo B, otros 10 del grupo C.

Cada boton tiene un ID diferente. El código que yo he puesto es para rastrear una clave dentro del id botón. Si nos ubicamos en el grupo A. todos los botones llevan la clave: _btnCheck, pero obvio el ID completo del un botón en el grupo A puede ser: e1_btnCheck, Otro es e2_btnCheck, Otro es e3_btnCheck y así sucesivamente.

Así que al hacer click en ellos, éstos me llevan al mismo método gracias a la clave que contiene una parte del ID.

Bien, ahora, hay muchos botones pero éstos están agrupados gracias a esa clave.

Cuando yo uso :

        $(function () {

                     $("[id*='_btnCheck']").click(function () {



                         var buttonName = $(this).attr('id');
                         ChannelEvent(buttonName);
                     });
  });

El botón me responde con yo deseo y me guía al evento, que luego se convierte en un webmethod en ASP.net.

Si yo pongo el código para buscar los siguientes grupos, B y C. El evento click no se dispara. Solo únicamente para el grupo A. Por ende estaba pensando en hacer un condicional el cual puede que funcione.

Si tienen una mejor idea, bienvenida sea. No soy muy bueno en JS. Gracias.

6
  • 1
    Creo que deberías explicarte mejor. El código debería hacer lo que comentas. ¿No funciona correctamente? ¿Te gustaría hacerlo de una forma diferente? el 12 may. 2016 a las 22:16
  • If buttonA clicked then ..., if ButtonB clicked then.... if ButtonC clicked then, me gustaría saber como hacer ese condicional en mi codigo js, el 12 may. 2016 a las 22:18
  • ¿Entonces quieres enlazar una misma función al evento click de todos los botones y ejecutar un código u otro en función del id? el 12 may. 2016 a las 22:21
  • Cierto, depende del objetivo. Me explicaré mejor digamos que tengo 10 de botones y estos son del grupo A, otros 10 botones son del B, otros 10 del C, Cada boton tiene un ID diferente. El código que yo he puesto es para rastrear una clave en especifico dentro del botón. Si nos ubicamos en el grupo A. todos los botones llevan la clave: btnCheck, pero obvio : es e1_btnCheck, e2_btnCheck, e3 btnCheck así que al hacer click en éstos me llevan al mismo método gracias a la clave en ellos el 12 may. 2016 a las 22:32
  • @N'oelC'alero Puedes editar tu pregunta original para agregar estos detalles.
    – OscarRyz
    el 12 may. 2016 a las 22:36

3 respuestas 3

2

Por lo que cuentas sería mejor que utilizaras clases para diferenciar los botones:

$('.btn').click(function(){
  var $boton = $(this);
  if ($boton.hasClass('btnCheck')){
    ChannelEvent($boton.attr('id'));
  }
  if ($boton.hasClass('btnRuta')){
    RouteEvent($boton.attr('id'));
  }
  if ($boton.hasClass('btnCliente')){
    alert('Botón cliente ' + $boton.attr('id'));
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="btn btnCheck" id="boton1">Check 1</Button>
<button class="btn btnCheck" id="boton2">Check 2</Button>
<button class="btn btnCheck" id="boton3">Check 3</Button>
<button class="btn btnCheck" id="boton4">Check 4</Button>
<button class="btn btnCheck" id="boton5">Check 5</Button>
<button class="btn btnRuta" id="boton6">Ruta 1</Button>
<button class="btn btnRuta" id="boton7">Ruta 2</Button>
<button class="btn btnRuta" id="boton8">Ruta 3</Button>
<button class="btn btnRuta" id="boton9">Ruta 4</Button>
<button class="btn btnRuta" id="boton10">Ruta 5</Button>
<button class="btn btnCliente" id="boton11">Cliente 1</Button>
<button class="btn btnCliente" id="boton12">Cliente 2</Button>
<button class="btn btnCliente" id="boton13">Cliente 3</Button>
<button class="btn btnCliente" id="boton14">Cliente 4</Button>
<button class="btn btnCliente" id="boton15">Cliente 5</Button>

1
  • 1
    You are a rock star! el 12 may. 2016 a las 23:06
1

Esto te podria servir, solo tienes que agregarles una clase comun a todos tus botones en este caso btn, por ejemplo:

    
    $(".btn").on("click",function(){
      
      switch($(this).attr('id')){
          case "_btnCheck":{
              //tu codigo para este caso
              alert("Click en check");
              break;
          }
          case "_btnRuta":{
              //tu codigo para este caso
              alert("Click en ruta");
              break;
          }
          case "_btnCliente":{
              //tu codigo para este caso
              alert("Click en cliente");
              break;
          }
      }
      
    });

//Este codigo es para resolver la duda en el comentario:

$(".grupoa").on("click", function () {
ChannelEventA($(this).attr('id'));
});

$(".grupob").on("click", function () {
ChannelEventB($(this).attr('id'));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="btn" id="_btnCheck">Check</Button>
<button class="btn" id="_btnRuta">Ruta</Button>
<button class="btn" id="_btnCliente">Cliente</Button>

4
  • Gracias, lo probaré me parece muy conveniente. el 12 may. 2016 a las 22:37
  • Bueno, "_btnCheck" no es un id, es una pista dentro del id, los id de botones del grupo A, pueden ser : e1_btnCheck, e2_btnCheck, e3_btnCheck. El _btnCheck es para rastrear a que evento se deben dirigir el 12 may. 2016 a las 22:56
  • Lo lograrias haciendo exactamente lo mismo, usando una clase para el grupo A y otra para el grupo B el 12 may. 2016 a las 22:59
  • Checale agregue un ejemplo que te puede servir al final del codigo el 12 may. 2016 a las 23:02
0

Esta es una opción:

$('button[type=submit]').click(function() {
 switch($(this).attr('id')){
 case "_btnCheck":{
    alert("el boton seleccionado fue: " + $(this).text());
   break;
 }
 case "_btnRuta":{
  alert("el boton seleccionado fue: " + $(this).text());
  break;
 }
 case "_btnCliente":{
   alert("el boton seleccionado fue: " + $(this).text());
  break;
 }
 } 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button type="submit" id="_btnCheck" value="Accept">Check</button>
<button type="submit" id="_btnRuta" value="Decline">Ruta</button>
<button type="submit" id="_btnCliente" value="Decline">Cliente</button>

Tu Respuesta

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

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