Adicionar atributos a un campo dependiendo del radiobutton seleccionado

Tengo dos radio button para elegir que campo debería ser obligatorio

Dependiendo del radio button que se escoja un campo pasara a ser obligatorio y el otro seguirá sin serlo

1 Respuesta

Respuesta
2

Hola ostheneo,

Si te he entendido bien tenemos los dos radios y dos inputs y cada radio obliga a que el campo esté relleno al hacer el submit, ¿es así?

<form>
  <input type="radio" name="obligatorio" value="#1"></input>
  <input type="text" id="1" name="campo1"></input>
  <input type="radio" name="obligatorio" value="#2">Female
  <input type="text" id="2" name="campo2"></input>
  <input type="submit" onclick="validacion()" />
</form>

Al hacer click en el botón deberíamos comprobar el radio marcado y comprobar si su input relacionado tiene valor.

Si te fijas he puesto como value en los radios el selector por id del input relacionado, esto nos harça más fácil la vida para comprobarlo mediante jquery.

function validation() {
    var inputId = $('input:radio[name=obligatorio]:checked').val();
    if (!$(inputId).val()) {
        alert('el campo ' + $(inputId).attr("name") + ' es obligatorio');
        return false;
    }
    else {
        $("form").submit();
    }
}

Hola ostheneo, si la respuesta te ha sido de utilidad no olvides valorarla :)

Algo parecido pero debeira ser algo así

<input type="radio" name="obligatorio" value="#1" onclick="mifuncion">

<input type="radio" name="obligatorio" value="#2" onclick="mifuncion">

<input type="text" id="1" name="campo1">

<input type="text" id="2" name="campo2">

mifuncion{

variables = radio.

if(radio = 1){

    campo1 - agregar atributo - obligatorio

   if (campo2 = tiene el atributo obligatorio){quitar atributo- campo 2}

}

if(radio = 2){

    campo2 - agregar atributo - obligatorio

   if (campo1 = tiene el atributo obligatorio){quitar atributo- campo 1}

}

}

La idea seria esa solo que no se como escribirlo en código javascript

<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.js"></script>
</head>
<body>
<input type="radio" name="obligatorio" value="1">
<input type="radio" name="obligatorio" value="2">
<input type="text" id="1" name="campo1">
<input type="text" id="2" name="campo2">
<script type="text/javascript">
    $(document).ready(function() {
      $('input:radio[name=obligatorio]').change(function () {
        var requiredInputId = $(this).val();
        var inputs = $('input:text');
        $.each(inputs, function (i, input) {
            var $input = $(input);
            if ($input.attr("id") == requiredInputId) {
                $input.attr("data-required", "true");
            } else {
                $input.attr("data-required", "false");
            }
        });
    });  
});
</script>
</body>
</html>

Entiendo que cuando te refieres al atributo "obligatorio" es al "data-required" que se usa en jquery-validation no?

Si es así he modificado un poco el código para que funcione. Ahora en los radios guardamos el id tal cual y, cuando el valor cambia, recorremos todos los inputs de tipo "text" que tengas para quitar a todos el "data-required" y solo dejarselo al que está marcado en el radio.

Añade tu respuesta

Haz clic para o

Más respuestas relacionadas

Manejo para formulario mediante script

Tengo el siguiente problemilla y no ce muy bien como solucionar La idea básicamente es esta Existente 2 archivos. -> procesa.php -> form.html En el archivo form.html existente 2 cosas, un formulario para enviar datos así <form> <input type="text"...
2 respuestas

Agregar filas a una tabla dinámicamente

Debo agregar filas a una tabla por medio de javascript sin que me refresque la página La idea es que después me pueda llevar la tablo tal ves por un array o algo parecido La idea seria esta, no puedo hacerlo por meidode un form porque ya me encuentro...
1 respuesta

Substring en formulario html

Para lo que domináis Java Script creo que lo que necesito es muy fácil . Estoy roto de no conseguirlo.. Tengo hecho un formulario en el que hay un form -campo1- que es el Nombre. Lo que necesito es que el usuario cuando introduzca su nombre en ese...
2 respuestas

Evento onclick en jquery no funciona en chrome

Tengo un formulario con un menu desplegable en el que el navegante elije su tarjeta de crédito. Tengo una función de jquery que hace que si elije una tarjeta en particular me muestre dos campos ocultos que solo corresponden a una tarjeta específica....
1 respuesta

Valor JavaScript a ASP

Mi pregunta es como pasar un valor JavaScript a Asp. Se que para pasarlo de ASP a JavaScript es de la siguiente manera: <script language='javascript'> var cadena=""; cadena = '<%=hora3%>'; </script> ¿Pero cómo lo hago de forma contraria?
1 respuesta

Calendario emergente

Tengo un formulario de inserción de registros donde los datos de vuelcan a una base de datos sql. Bien el tema es que tengo un campo que es fecha y me gustaría introducir un calendario emergente cuando se pulsara un botón. Mi pregunta es la...
2 respuestas

Pasar variables en funciones onclick de un form

Quiero pasar valores de mi forma a una función por medio de onclick lo que realizo es lo siguiente: <form method="POST" name="log"> <p> <span class="login">Usuario:</span><input name="log" type="text" size="10"> <span...
1 respuesta

Habilitar submit con javascript

Tengo un form donde importo un archivo y lo imprimo en pantalla marcando un borde rojo si hay errores para que el usuario los corrija, el tema es que quiero que se habilite el submit cuando este todo correcto. Estoy usando esta función pero no se...
1 respuesta

Duda Uploadify

Carlos vuelvo a acudir a ti porque me ha surgido una duda con un plugin de Jquery y no sabia solucionarla. El caso es que tengo un formulario con diferentes tipos de entradas ademas de una entrada file que a través del plugin Uploadify me carga los...
1 respuesta

Select Dependientes + Textbox, Problema.

Mi problema es que necesito combinar selects dependientes con un textbox. La verdad no entiendo porque no funciona, por separado funcionan bien, pero al júntalos no muestra nada. Alguien podría ayudarme. Adjunto los archivos para que entiendan sobre...
1 respuesta