Usando un botón de opción simple, si selecciono la opción yes o no, siempre llama a la opción yes.

A continuación se muestra mi código:

$('input:radio[name="selectlinktype"]').change(function() {
  if ($('input:radio[name="selectlinktype"]').val() == 'Yes') {
    alert("yes");
    var dropdownval = $("#dropDownsub").val();
    target_element.removeAttr('href').attr('action', dropdownval);
  }

  if ($('input:radio[name="selectlinktype"]').val() == 'No') {
    alert("no");
    var dropdownval = $("#dropDownsub").val();
    // target_element.removeAttr('href');
    target_element.removeAttr('action').attr('href', $("#edit-link-url .url").val());
    $(event.target).attr("href", $("#edit-link-url .url").val());
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="radio" id="int-link" name="selectlinktype" value="Yes" /> Yes
<input type="radio" id="href-link" name="selectlinktype" value="No" /> No

Seleccione sí o no, siempre irá dentro de la condición yes, la condición no nunca se activa. ¿A dónde me estoy yendo mal?

1
user2828442 10 sep. 2018 a las 09:07

6 respuestas

La mejor respuesta

Está seleccionando el primer elemento con el nombre selectlinktype, por lo que siempre es yes. Agregue :checked a su selector para seleccionar el elemento seleccionado real.

$('input:radio[name="selectlinktype"]').change(function(){
  if($('input:radio[name="selectlinktype"]:checked').val() == 'Yes'){
     alert("yes");
     var dropdownval = $("#dropDownsub").val();
     target_element.removeAttr('href').attr('action', dropdownval);
  }
  
  if($('input:radio[name="selectlinktype"]:checked').val() == 'No'){
   alert("no");
    var dropdownval = $("#dropDownsub").val();
   // target_element.removeAttr('href');
    target_element.removeAttr('action').attr('href',$("#edit-link-url .url").val() );
    $(event.target).attr("href" , $("#edit-link-url .url").val()); 
 }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="radio" id="int-link"  name="selectlinktype" value="Yes" /> Yes
  <input type="radio" id="href-link"  name="selectlinktype" value="No" /> No
1
Justinas 10 sep. 2018 a las 06:12
 $('input:radio[name="selectlinktype"]').change(function(){
  var value = $(this).val();
  if(value == 'Yes'){
     alert("yes");
     var dropdownval = $("#dropDownsub").val();
     $(this).removeAttr('href').attr('action', dropdownval);
  } else if(value == 'No'){
   alert("no");
    var dropdownval = $("#dropDownsub").val();
   // target_element.removeAttr('href');
    $(this).removeAttr('action').attr('href',$("#edit-link-url .url").val() );
    $(this).attr("href" , $("#edit-link-url .url").val()); 
 }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="radio" id="int-link"  name="selectlinktype" value="Yes" /> Yes
<input type="radio" id="href-link"  name="selectlinktype" value="No" /> No
0
Rahul Koshti 28 jun. 2019 a las 13:16

Su selector actual está haciendo coincidir los dos botones de radio. Utilice :checked como parte del selector o this para apuntar a la radio actual:

$('input:radio[name="selectlinktype"]').change(function(e){
  console.clear();
  console.log(e.target);
  if($(this).val() == 'Yes'){
     alert("yes");
     //var dropdownval = $("#dropDownsub").val();
     //target_element.removeAttr('href').attr('action', dropdownval);
  }  
  else if($(this).val() == 'No'){
   alert("no");
    //var dropdownval = $("#dropDownsub").val();
    //target_element.removeAttr('href');
    //target_element.removeAttr('action').attr('href',$("#edit-link-url .url").val() );
    //$(event.target).attr("href" , $("#edit-link-url .url").val()); 
 }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="radio" id="int-link"  name="selectlinktype" value="Yes" /> Yes
<input type="radio" id="href-link"  name="selectlinktype" value="No" /> No
1
Mamun 28 sep. 2018 a las 11:09

input:radio[name="selectlinktype"] seleccionará ambas entradas. Luego, .val() busca value del primero, que resulta ser "yes" (debido a value="yes").

Debe subseleccionar la entrada si está seleccionada o no: input:radio[name="selectlinktype"]:checked

Alternativamente, puede ver cuál era el objetivo del evento (porque normalmente el evento de cambio se originaría en el elemento que se acaba de activar), de modo que no se necesita un selector: use this o event.target.

3
Amadan 10 sep. 2018 a las 06:13

Puede administrarlo con un evento de clic

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="radio" id="int-link"  name="radio_name" value="Yes" /> Yes
<input type="radio" id="href-link"  name="radio_name" value="No" /> No

<script>
$('input:radio[name="radio_name"]').click(function(){
  var radio_val = $(this).val()
  if(radio_val == 'Yes'){
     alert("yes");
  }  
  else if(radio_val == 'No'){
   alert("no");
 }
});
</script>
0
David 10 sep. 2018 a las 07:01

Está verificando el valor de la radio con el nombre selectlinktype pero necesita verificar el botón de radio en el que se hace clic y se selecciona

Además, use el bloque if y else if en lugar de dos if. Use $(this) para el elemento objetivo, vea el código a continuación

 $('input:radio[name="selectlinktype"]').change(function(){
  var value = $(this).val();
  if(value == 'Yes'){
     alert("yes");
     var dropdownval = $("#dropDownsub").val();
     $(this).removeAttr('href').attr('action', dropdownval);
  } else if(value == 'No'){
   alert("no");
    var dropdownval = $("#dropDownsub").val();
   // target_element.removeAttr('href');
    $(this).removeAttr('action').attr('href',$("#edit-link-url .url").val() );
    $(this).attr("href" , $("#edit-link-url .url").val()); 
 }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="radio" id="int-link"  name="selectlinktype" value="Yes" /> Yes
<input type="radio" id="href-link"  name="selectlinktype" value="No" /> No
1
Bhushan Kawadkar 10 sep. 2018 a las 06:09