Ver Mensaje Individual
  #1 (permalink)  
Antiguo 27/03/2013, 09:51
fkocs
 
Fecha de Ingreso: agosto-2010
Mensajes: 1
Antigüedad: 14 años, 4 meses
Puntos: 0
Pregunta Validar campos a medida que se activen divs

Buenas tardes..!

Les queria hacer la siguiente consulta.!

Yo tengo 2 funciones js, una que es para ocultar/mostrar divs y otra q es para validar el formulario..

Lo que yo oculto y muestro son campos del formulario, para serle mas explicito es un formulario de compra y los divs ocultan cantidad de productos.. dependiendo de la cantidad de productos que elijan es la cantidad de campos que aparecen..

para ello utilizo este script
Código:
    <script type="text/javascript">
function mostrardiv(Cantidad) 
{ 

  for(i=1;i<=10;i++) 
  { 
     document.getElementById('div_'+i).style.display = 'none'; 
   
     if(i<=Cantidad) 
     { 
        document.getElementById('div_'+i).style.display = 'block'; 
     } 
  } 
}  
</script>
y para validar los formularios utilizo
Código:
$(function() {
var emailreg = /^[a-zA-Z0-9_\.\-]+@[a-zA-Z0-9\-]+\.[a-zA-Z0-9\-\.]+$/;
var numreg = /^(\d{0,9})$/;
var letreg = /^[A-Za-z]+$/;
var pwreg = /(?!^[0-9]*$)(?!^[a-zA-Z]*$)^([a-zA-Z0-9]{8,20})$/;

var namereg = /^[A-Z]+[a-z]+ [A-Z]+[a-z]/;
  $('.error').hide();
  $('input.form-poshytip').css({backgroundColor:"#FFFFFF"});
  $('input.form-poshytip').focus(function(){
    $(this).css({backgroundColor:"#cFF"});
  });
  $('select.form-poshytip').focus(function(){
    $(this).css({backgroundColor:"#cFF"});
  });
    $('input.form-poshytip').error(function(){
    $(this).css({backgroundColor:"#f99"});
  });
    $('select.form-poshytip').blur(function(){
    $(this).css({backgroundColor:"#FFFFFF"});
  });
  $('input.form-poshytip').blur(function(){
    $(this).css({backgroundColor:"#FFFFFF"});
  });
  
	 $("#name, #dni, #pais, #mail1, #mail2, #prov, #ciudad, #pw, #hname, #rcon").keyup(function(){
		if( $(this).val() != "lkkjaswjasdASWASDjuiquansuqw213ADW23ad" ){
			$(".error").fadeOut();			
			return false;
		}
	 });
	 	 $("#reppw").keyup(function(){
		if( $(this) != "lkkjaswjasdASWASDjuiquansuqw213ADW23ad" ){
			$(".error").fadeOut();			
			return false;
		}
	 });
	 
  $(".button").click(function() {
		// validate and process form
		// first hide any error messages
    $('.error').hide();
		
	  var name = $("input#name").val();
		if (name == "") {
      $("label#name_error").show();
      $("input#name").focus();
      return false;
    }
	var dni = $("input#dni").val();
		if (dni == "") {
      $("label#dni_error").show();
      $("input#dni").focus();
      return false;
    }
	var dni = $("input#dni").val();
		if (!numreg.test($("#dni").val())) {
      $("label#dni2_error").show();
      $("input#dni").focus();
      return false;
    }
		var mail1 = $("input#mail1").val();
		if (mail1 == "") {
      $("label#mail1_error").show();
      $("input#mail1").focus();
      return false;
    }
		var mail1 = $("input#mail1").val();
		if (!emailreg.test($("#mail1").val())) {
      $("label#mail12_error").show();
      $("input#mail1").focus();
      return false;
    }
	var mail2 = $("input#mail2").val();
		if (mail2 == "") {
      $("label#mail2_error").show();
      $("input#mail2").focus();
      return false;
    }
	var mail2 = $("input#mail2").val();
		if (!emailreg.test($("#mail2").val())) {
      $("label#mail22_error").show();
      $("input#mail2").focus();
      return false;
    }
	var mail2 = $("input#mail2").val();
		if (mail2 == mail1) {
      $("label#mail23_error").show();
      $("input#mail2").focus();
      return false;
    }
	var pais = $("input#pais").val();
		if (pais == "") {
      $("label#pais_error").show();
      $("input#pais").focus();
      return false;
    }
	var prov = $("input#prov").val();
		if (prov == "") {
      $("label#prov_error").show();
      $("input#prov").focus();
      return false;
    }
	var ciudad = $("input#ciudad").val();
		if (ciudad == "") {
      $("label#ciudad_error").show();
      $("input#ciudad").focus();
      return false;
    }
		var pw = $("input#pw").val();
		if (pw == "") {
      $("label#pw_error").show();
      $("input#pw").focus();
      return false;
    }
		var pw = $("input#pw").val();
		if (!pwreg.test($("#pw").val())) {
      $("label#pw2_error").show();
      $("input#pw").focus();
      return false;
    }
		var reppw = $("input#reppw").val();
		if (reppw == "" || pw != reppw) {
      $("label#reppw_error").show();
      $("input#reppw").focus();
      return false;
    }
		var hname = $("input#hname").val();
		if (hname == "") {
      $("label#hname_error").show();
      $("input#hname").focus();
      return false;
    }
		var slot = document.getElementById('slot').value;
		if (slot == "") {
      $("label#slot_error").show();
      $("slot").focus();
      return false;
    }
		var rcon = $("input#rcon").val();
		
		if (rcon == pw) {
      $("label#rcon2_error").show();
      $("input#rcon").focus();
      return false;
    }
			var rcon = $("input#rcon").val();
		
		if (rcon == "") {
      $("label#rcon_error").show();
      $("input#rcon").focus();
      return false;
    }
	var pago = document.getElementById('pago').value;
		if (pago == "23") {
      $("label#pago_error").show();
      $("pago").focus();
      return false;
    }


		var dataString = 'name='+ name + '&dni=' + dni + '&mail1=' + mail1 + '&mail2=' + mail2 + '&pais=' + pais + '&prov=' + prov + '&ciudad=' + ciudad + '&pw=' + pw + '&reppw=' + reppw + '&hname=' + hname + '&slot=' + slot + '&rcon=' + rcon + '&pago=' + pago ;
		//alert (dataString);return false;
		
		$.ajax({
      type: "POST",
      url: "js2/process.php",
      data: dataString,
      success: function() {
        $('#compra_form').html("<div id='message'></div>");
        $('#message').html("<div align='center'><img id='checkmark' src='images/check.png' /> Su pedido fue enviado. En instantes recibiras la boleta para que pueda realizar el pago.</div>")
        .append("")
        .hide()
        .fadeIn(1500, function() {
          $('#message').append("");
        });
      }
     });
    return false;
	});
});
runOnLoad(function(){
  $("input#name").select().focus();
});
lo que necesito realizar es validar los campos a medida que el cliente valla activando los productos, es decir que si elije como cantidad 2 productos solo valide y haga obligatorios los campos para esos 2 productos.. y el resto no porque estan ocultos..