0

Me gustaria aplicar una accion de reseteo de los campos de mi formulario y me gustaria que al momento de dar en cancelat en el span de la "x" me devuelva el border originar si es que lo cierra o lo cancela con errores. Actualmente me funciona solo con la "x" de cerra, si hace el reseteo pero quiero que no solo con span sino con buttons funcione.

Codigo Actual:

$('span').click(function (event) {
    $('#selCertificacionP option').remove();
    $('#selCertificacion option').remove();
    $("#txtNombreP").css("border-color", "white");
    $("#txtRFCP").css("border-color", "white");
    $("#txtDireccionP").css("border-color", "white");
    $("#txtColoniaP").css("border-color", "white");
    $("#txtCiudadP").css("border-color", "white");
    $("#txtEstadoP").css("border-color", "white");
    $("#txtPaisP").css("border-color", "white");
    $("#txtCodigoP").css("border-color", "white");
    $("#txtTelefonoP").css("border-color", "white");
    $("#selCertificacionP").css("border-color", "white");
    $("#txtFolioP").css("border-color", "white");
    $("#txtFecInicioP").css("border-color", "white");
    $("#txtFecFinP").css("border-color", "white");
});

Me gustaria pasarle dos paramteros o tres parametros al evento .click de jquery, para que de ahi mismo se lo aplique al boton o cualquier elemento que yo decida.

7
  • Quieres añadir el mismo listener al evento click de dos elementos, o quieres gatillar el evento click en dos elementos?
    – ffflabs
    Commented el 21 feb. 2017 a las 22:28
  • @amenadiel gatillar el evento click en dos elementos?
    – David
    Commented el 21 feb. 2017 a las 22:29
  • Podrías probar $('span,button').trigger('click');
    – ffflabs
    Commented el 21 feb. 2017 a las 22:30
  • @amenadiel esa funcion tambien es valida con id´s?
    – David
    Commented el 21 feb. 2017 a las 22:33
  • Claro, todo lo que separes por coma en un selector, amplía la selección $('#cancelar,#resetear').trigger('click');
    – ffflabs
    Commented el 21 feb. 2017 a las 22:35

2 respuestas 2

1

Buenas, te aconsejo usar una clase css padre en el formulario.

Digamos que tenemos esto en html:

 <form id="miFormulario" class=""> 
   <input type="text" placheholder="campo 1"/>
   <input type="text" placheholder="campo 2" />
   <button onclick="resetearFormulario()" >Resetear</button> 
 </form>

Ahora queremos darle un aspecto diferente si tener que escribir tanto jquery. Además separamos código css del de javascript. Podemos jugar con los valores de class del formulario.

En nuestra hoja de estilos tendríamos:

#miFormulario.fill input{} /* aplica a todos los inputs */
#miFormulario.fill textarea{} /* aplica a todos los textarea*/

#miFormulario.clean input{} /* aplica a todos los inputs */
#miFormulario.clean textarea{} /* aplica a todos los textarea*/

Haríamos algo parecido a esto en javascript:

<script>
   function resetearFormulario(){
      $('#miFormulario')[0].reset();//reseteamos 

      $('#miFormulario').attr('class','clean');
      /* se puede hacer de muchas formas por ejemplo
      $('#miFormulario').removeClass('fill').addClass('clean');  
      */
   }
</script>

Automáticamente estaremos reseteando el formulario y aplicando los estilos correspondientes.

Tambien puedes hacer uso del operador de selección "," de esta forma:

$('span').click(function (event) {
  $('#selCertificacionP option,#selCertificacion option').remove(); 
  $("#txtNombreP,#txtRFCP,#txtDireccionP,#txtColoniaP,#txtCiudadP,#txtEstadoP,#txtPaisP,#txtCodigoP,#txtTelefonoP,#selCertificacionP,#txtFolioP,#txtFecInicioP,#txtFecFinP").css("border-color", "white");

});

Pero te lo desaconsejo , crear ids porque sí no es una buena idea , utiliza una clase , así :

$('span').click(function(){
 $('.myselects option').remove();
 $('.myInputs').css('border-color','white');
});

Tu pregunta es muy amplia ya que tiene muchas soluciones posibles , pero siempre es mejor delegar a cada cosa su trabajo , usar una clase css con el estilo a aplicar suele ser lo más optimo y re utilizable.

Saludos

1

Coloca los elementos separados por coma: por ejemplo

$("#txtNombreP, #txtRFCP, #txtDireccionP").css("border-color", "white");

1
  • Se aplaude la intención de responder y ayudar. Por favor agrega una explicación de por qué o cómo tu solución resuelve el problema del AP. Para más información, lee Cómo responder. Un saludo.
    – jachguate
    Commented el 14 jun. 2019 a las 20:52

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.